如何 运行 使用 babel 进行 reactbootstrap？

Question

我正在尝试 运行 this 在我的 Webpack/ReactJS 设置中进行采样。我也做了：

npm react-bootstrap

这是我的组件：

import React from 'react'
const {
    Navbar,
    Nav,
    NavItem,
    NavDropdown,
    MenuItem
} = ReactBootstrap;

export class ModalTest extends React.Component {
    constructor() {
        super();

    }

    render() {
        return (
            <Navbar>
                <Navbar.Header>
                    <Navbar.Brand>
                        <a href="#">React-Bootstrap</a>
                    </Navbar.Brand>
                </Navbar.Header>
                <Nav>
                    <NavItem eventKey={1} href="#">Link</NavItem>
                    <NavItem eventKey={2} href="#">Link</NavItem>
                    <NavDropdown eventKey={3} title="Dropdown" id="basic-nav-dropdown">
                        <MenuItem eventKey={3.1}>Action</MenuItem>
                        <MenuItem eventKey={3.2}>Another action</MenuItem>
                        <MenuItem eventKey={3.3}>Something else here</MenuItem>
                        <MenuItem divider />
                        <MenuItem eventKey={3.3}>Separated link</MenuItem>
                    </NavDropdown>
                </Nav>
            </Navbar>
        );
    }
}

export default ModalTest

但是当我 运行 我的项目时，我得到：

Uncaught ReferenceError: ReactBootstrap is not defined

我该如何解决这个问题或者我需要更多参考资料？

Answer 1

您需要导入 react-bootstrap 组件，例如

import {Navbar, Nav,NavItem, NavDropdown, MenuItem} from  'react-bootstrap';

Answer 2

你必须像这样导入你的 react-bootstrap 组件。

import {Navbar, Nav,NavItem, NavDropdown, MenuItem} from  'react-bootstrap';