首页 > 解决方案 > 为什么这个反应示例中没有显示菜单?

问题描述

我从反应引导程序中获取了 NavBar 示例并尝试运行,但它不会呈现。

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

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

标签: reactjsreact-bootstrap

解决方案


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内部的组件,这会创建一个无限循环。


推荐阅读