PROSAGA码农传奇-react-react-router-bootstrap linkcontainer

<div class =“post-text”itemprop =“text”>
  <P>
    我刚才遇到了同样的问题。是的，您必须设置react-router，就像您没有使用react-router-bootstrap一样。对于你的应用程序（猜测你只想要与NavItens你设置的相同级别路径）我认为它将是这样的（假设你在id =“app”的div中渲染你的应用程序组件）：
  </p>
   <pre>
    <code>
      ReactDOM.render((
<Router history={browserHistory}>
    <Route path="/" component={App}>
        <IndexRoute component={Home} />
        <Route path="/Filter" component={Filter} />
        <Route path="/Signup" component={Signup} />
        <Route path="/Login" component={Login} />
        <Route path="/Profile" component={Profile} />
        <Route path="/Search" component={Search} />
        <Route path="/AddNewCard" component={AddNewCard} />
        <Route path="/SavedCard" component={SavedCard} /> 
   </Route>
</Router>
), document.getElementById('app'))

</code>
  </pre>
  <P>
    你必须将react-bootstrap的NavItens放在react-router-bootstrap的LinkContainers中。如果您有索引链接，则应使用IndexLinkContainers。但是如果你想在你的Navbar.Brand中链接（这是你的情况），我找到的最佳解决方案是用一个带有className ='nav-bar-brand'的react-router链接替换Navbar.Brand。
  </p>
  <P>
    这就是我猜你的解决方案应该是：
  </p>
   <pre>
    <code>
      <Navbar inverse collapseOnSelect>
      <Navbar.Header>
        <Link to='#' className='navbar-brand'>BIZIT</Link>
      </Navbar.Header>
      <Navbar.Collapse>
        <Nav>
          <LinkContainer to="Filter">
              <NavItem eventKey={1}>Filter</NavItem>
          </LinkContainer>
          <LinkContainer to="Search">
              <NavItem eventKey={2}>Search</NavItem>
          </LinkContainer>
        </Nav>
        <Nav pullRight>
          <LinkContainer to="/Signup">
              <NavItem eventKey={1}>Sign Up</NavItem>
          </LinkContainer>
          <LinkContainer to="/Login">
              <NavItem eventKey={2}>Login</NavItem>
          </LinkContainer>
        </Nav>
      </Navbar.Collapse>
    </Navbar>
    <CardList
      saveButtonHandler={this.saveButtonHandler}
      cards={this.state.cards}
      />
    <Navbar inverse collapseOnSelect fixedBottom>
      <Navbar.Collapse>
        <Nav>
          <LinkContainer to="/">
              <NavItem eventKey={4}>Home</NavItem>
          </LinkContainer>
          <LinkContainer to="/Profile">
              <NavItem eventKey={5}>Profile</NavItem>
          </LinkContainer>
          <LinkContainer to="/AddNewCard">
            <NavItem eventKey={6}>Add Card</NavItem>
          </LinkContainer>
          <LinkContainer to="/SavedCard">
              <NavItem eventKey={7}>Saved Cards</NavItem>
          </LinkContainer>
        </Nav>
      </Navbar.Collapse>
    </Navbar>

</code>
  </pre>
</DIV>