我正在使用react进行Web应用程序,并且在react-router方面遇到了一些问题。根据我阅读的教程,我可以使用this.props.router
访问版本3.0.0中的路由器,并以编程方式更改位置this.props.router.push('/home')
。
不幸的是,在所有这些教程中,所有组件都在同一个文件中。但是,我的结构是将每个组件都放在自己的文件中。
路由器在index.js
文件中定义。
/src
/pages
Home.js
Landingpage.js
index.js
以上是我项目结构的相关部分。以下是我的index.js
文件的代码
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import Landingpage from './pages/Landingpage'
import Home from './pages/Home'
import {
Router,
Route,
IndexRoute,
IndexLink,
Link,
browserHistory } from 'react-router';
import './index.css';
ReactDOM.render(
<Router history={browserHistory}>
<Route path="/" component={App}>
<IndexRoute component={Landingpage}/>
<Route path="home" component={Home}/>
</Route>
</Router>,
document.getElementById('root')
);
我想要的是访问我/pages
目录中文件中的上述路由器实例。我尝试了各种教程中的几种方法,例如在withRouter(componentName)
文件中使用index.js
。
提前致谢