Question

这与Make Twitter Bootstrap navbar work like tabs有关但我正试图在React中使用它。基本上，我想在导航栏中显示标签。有没有简单的方法呢？
http://react-bootstrap.github.io/components.html#navigation

<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>
  </Nav>
</Navbar>

代替NavItem，我可以使用吗？ <Tab eventKey={1} title="Tab 1">Tab 1 content</Tab>

Answer 1

只需使用

constructor(state) {
        super(state);
        this.state = {
            activeKey: 1
        };
    }

    handleSelect(eventKey) {
        this.setState({
            activeKey: eventKey
        });
    }

render() {

       <Nav bsStyle="tabs" activeKey={this.state.activeKey} 
        onSelect={this.handleSelect.bind(this)}>

        <...>
      }

代替<Nav>，它将完成这项工作。 Docs

React Bootstrap Navbar中的选项卡

1 个答案: