为什么这个反应示例中没有显示菜单？

Question

我从 React bootstrap 中获取 NavBar 示例并尝试运行但是它不会呈现。

任何想法，没有运行时间错误，所以我有点难过。

https://codesandbox.io/s/tender-mccarthy-y9tb4

Answer 1

function Header() {
  return (
    <Header>
      <Navbar bg="light" expand="lg">
        <Navbar.Brand href="#home">React-Bootstrap</Navbar.Brand>
        <Navbar.Toggle aria-controls="basic-navbar-nav" />
        <Navbar.Collapse id="basic-navbar-nav">
          <Nav className="mr-auto">
            <Nav.Link href="#home">Home</Nav.Link>
            <Nav.Link href="#link">Link</Nav.Link>
            <NavDropdown title="Dropdown" id="basic-nav-dropdown">
              <NavDropdown.Item href="#action/3.1">Action</NavDropdown.Item>
              <NavDropdown.Item href="#action/3.2">
                Another action
              </NavDropdown.Item>
              <NavDropdown.Item href="#action/3.3">Something</NavDropdown.Item>
              <NavDropdown.Divider />
              <NavDropdown.Item href="#action/3.4">
                Separated link
              </NavDropdown.Item>
            </NavDropdown>
          </Nav>
        </Navbar.Collapse>
      </Navbar>
    </Header>
  );
}

您正在内部使用 Header 组件，这会创建一个无限循环。

为什么这个反应示例中没有显示菜单？

Why is the menu not showing in this react example?

reactjs

react-bootstrap