我已经在ES6中使用react路由器实现了一个反应JS测试应用程序,但它似乎不起作用.我的代码片段如下：
app.js
-------
import React from 'react';
import ReactDOM from 'react-dom';
import Routes from './routes';
ReactDOM.render(Routes,document.getElementById('react-container'));
routes.js
---------
import React from 'react';
import { DefaultRoute,Link,Route,RouteHandler,Router } from 'react-router';
import Page1 from './page1';
import Home from './home';
import { IndexRoute } from 'react-router';
let routes =
<Router>
<Route path="/" component={Home}>
<Route path="page1" component={ Page1 }/>
</Route>
</Router>
export default routes
home.js
-------
import React,{ Component } from 'react';
import Header from './components/header';
export default class Home extends Component {
constructor() {
super();
}
render() {
return (
<div>
<Header />
{this.props.children}
</div>
);
}
}
page1.js
--------
import React,{ Component } from 'react';
export default class Page1 extends Component {
constructor() {
super();
}
render() {
return (
<div>
<h1> Page 1 </h1>
</div>
);
}
}
听起来你想在导航到/时显示第1页以显示？如果是这样,那么默认情况下你需要一个IndexRoute /路由到page1的
docs seem to indicate：
let routes = (
<Router>
<Route path="/" component={Home}>
<IndexRoute component={Page1} />
</Route>
</Router>
);
