Reactjs react-bootstrap js错误

时间:2016-06-19 01:39:51

标签: reactjs sails.js react-bootstrap

我根据这个回购制作了反应应用程序:

    https://github.com/wi2/isomorphic-sails-react-example

现在我正在按照他们的入门指令实现react-bootstrap。我尝试了导航栏演示,但是当我尝试执行简单行为(例如折叠/解除下拉菜单)时,显示器和javascript错误。

navigation.js

"use strict";

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

export class Navigation {
  render() {
    return (
      <Navbar inverse>
        <Navbar.Header>
          <Navbar.Brand>
            <a href="#">React-Bootstrap</a>
          </Navbar.Brand>
          <Navbar.Toggle />
        </Navbar.Header>
        <Navbar.Collapse>
          <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>
          <Nav pullRight>
            <NavItem eventKey={1} href="#">Link Right</NavItem>
            <NavItem eventKey={2} href="#">Link Right</NavItem>
          </Nav>
        </Navbar.Collapse>
      </Navbar>
    )
  }
}

output

我是否错过了必须包含一些js库的内容?

1 个答案:

答案 0 :(得分:0)

尝试使用Navigation类扩展React Component

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

export class Navigation extends Component {
...