問題與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>