react-router
import {Link,Route , Router , IndexRoute , hashHistory, Redirect} from 'react-router';
import React {Component} from 'react';
class Main extends Component{
render(){
<div>{this.props.children}</div>
}
}
const route = {
<Router history={hashHistory}>
<Route path='/' component={Main}>
<IndexRoute component={Index}/>
<Route path="Menu" component={Menu}/>
<Route path="About" component={About} />
<Route path="Article/:id" component={ArticleId} />
</Route>
</Router>
}
在Router组件之外,导航到路由页面,可以使用浏览器的History API
例如
export class Main extends Component {
constructor(props) {
super(props);
this.submit = () => {
hashHistory.push("/")
}
}
render() {
return (
<div>
<Link onClick={this.context.router.goBack}>
<i>单击返回上一个has路径</i>
</Link>
<div onClick={this.submit}></div>
</div>
)
}
}
Main.contextTypes = {
router: React.PropTypes.object.isRequired
}