由于React-Bootstrap NavDropdown,``下一个启动''失败

时间:2019-06-06 23:53:27

标签: javascript node.js reactjs react-bootstrap next.js

我正在尝试运行应用程序的生产版本,并且在构建它之后,“下一个启动”失败。我在/node_modules/react-overlays/DropdownToggle.js:36:22

中收到状态为“无法读取未定义的属性'show'的未定义”的错误

运行开发版本很好,一旦我删除了“ NavDropDown”组件,一切都将正常运行。在这种情况下,我可以在构建后使用“ npm run start”或“ next start”命令。

import Header from './header';
import Link from 'next/link';

import { Navbar, Nav, NavDropdown, Form, FormControl, Button } from 'react-bootstrap';

//Top navigation of the application
function Navigation() {
  return (
    <div className="navigationHeader">
      <Header />
      <Navbar collapseOnSelect expand="lg" bg="primary" variant="dark" fixed="top">
        <Link href="/" prefetch>
          <a>
            <Navbar.Brand>
              My Application
            </Navbar.Brand>
          </a>
        </Link>
        <Navbar.Toggle aria-controls="responsive-navbar-nav" />
        <Navbar.Collapse id="responsive-navbar-nav">
          <Nav className="ml-auto">



            {/* Trouble code below */}
            <NavDropdown title="Account" id="collasible-nav-dropdown">
              <NavDropdown.Item href="/admin" disabled>Admin</NavDropdown.Item>
              <NavDropdown.Divider />
              <NavDropdown.Item href="/my-account" disabled>My Account</NavDropdown.Item>
              <NavDropdown.Item href="/register">Register</NavDropdown.Item>
              <NavDropdown.Item href="/login">Login</NavDropdown.Item>
            </NavDropdown>
           {/* End of trouble code */}


            <Nav.Link href="/browse" disabled>Browse</Nav.Link>
            <Nav.Link href="/services">Manage Services</Nav.Link>
            <Nav.Link eventKey={2} href="/cart" className="mr-sm-2" disabled>
              Cart
            </Nav.Link>
          </Nav>
          <Form inline>
            <FormControl type="text" placeholder="Search" className="mr-sm-2" disabled />
            <Button variant="success" disabled>Search</Button>
          </Form>
        </Navbar.Collapse>
      </Navbar>
    </div>
  );
}

export default Navigation;

回顾一下,我可以运行npm run dev'next',也可以运行npm run build而没有问题。一旦我运行npm run start'next start'并连接到端口,应用程序就会崩溃,并在/node_modules/react-overlays/DropdownToggle.js:36:22 <中显示错误“无法读取未定义的属性'show'”。 / p>

但是,如果删除故障代码,则一切正常。有任何想法吗?我是否在组件中缺少参数?我只是关注了react-bootstrap文档。

谢谢。 :)

0 个答案:

没有答案