问题与LinkContainer与NavItem中的反应重定向

Question

我是一个新手反应。我正尝试通过引导程序导航栏进行重定向。我的导航栏的代码如下所示

import React, { Component, PropTypes } from 'react'; 
import { Navbar, Nav, NavItem } from 'react-bootstrap'; 
import { LinkContainer } from 'react-router-bootstrap'; 
import { Link } from 'react-router-dom'; 
import {connect} from 'react-redux'; 
import * as actionCreators from '../action_creators'; 

class MainNav extends Component { 

    constructor(props) { 
     super(props); 
     this.state = { 
     loggedIn: 1, 
     }; 
    } 
    render() { 
     return (
       <div> 
       <Navbar inverse collapseOnSelect> 
        <Navbar.Header> 
         <Navbar.Brand> 
          <a href="/">Test NavBar</a> 
         </Navbar.Brand> 
        <Navbar.Toggle /> 
        </Navbar.Header> 
        <Navbar.Collapse> 
         <Nav> 
          <LinkContainer to={`/test1`}> 
           <NavItem onClick={this.props.getTestContent1} eventKey={1}>Test1</NavItem> 
          </LinkContainer> 
          <LinkContainer to = {`/test2`}> 
           <NavItem onClick={this.props.getTestContent2} eventKey={2}>Test2</NavItem> 
          </LinkContainer> 
         </Nav> 
        </Navbar.Collapse> 
       </Navbar> 
       <div className="content"> 
        {this.props.children} 
       </div> 
      </div> 
     ) 
    } 
} 

MainNav.propTypes = { 
    getTestContent1 : PropTypes.func.isRequired, 
    getTestContent2 : PropTypes.func.isRequired, 
}; 

export default connect(null,actionCreators)(MainNav); 

正如你可以看到每个导航项目连有一个onclick事件，这是为了获取其为此我使用终极版，形实转换来自服务器的数据。那部分我没有问题。我面临的主要问题是重定向不会发生。我的路线文件看起来像下面

import MainNav from './components/navbar.jsx'; 
import {HomePageContainer} from './components/defaultHome.jsx'; 
import testHomePageContainer from './components/testHomePage.jsx'; 
import React from 'react'; 
import ReactDOM from 'react-dom'; 
import {Route,Switch } from 'react-router-dom'; 

export const routes2 = 
    <MainNav> 
     <Switch> 
      <Route exact path="/" component={HomePageContainer}/> 
      <Route path="/test1" component={testHomePageContainer}/> 
      <Route path="/test2" component={testHomePageContainer}/> 
     </Switch> 
</MainNav> 

所以当我Test1上单击我仍然在主页容器和testHomePageContainer是没有得到呈现。 我不确定什么是阻止重定向。我在这里先向您的帮助表示感谢。

Answer 1

我不知道你的反应，所有其他版本，但你可以得到帮助与更新版本做出反应：

"history": "^4.6.3", 
"react": "^15.6.1", 
"react-dom": "^15.6.1", 
"react-router": "^4.1.2", 
"react-router-dom": "^4.1.2", 
"webpack": "^3.3.0", 
"webpack-dev-server": "^2.5.1" 

阵营溃败看起来像是......

import {BrowserRouter,Route,Link} from 'react-router-dom'; // for BrowserRouter rout 

<BrowserRouter> 
     <div> 
      <Route exact path='/' component={Layout}></Route> 
      <Route path='/test1' name="test1" component={testHomePageContainer}> </Route> 
      <Route path='/test2' name="test2" component={Nametest}></Route> 
     </div> 
</BrowserRouter> 

更多关于新的详细信息React Rout Quick Start

对于链接查看或导航查看

<Link to="/test1">Check rout link test1</Link> 
    <Link to="/test2">Check rout link test2</Link>