react使用router的尝试。
关于路由嵌套
Route组件还可以嵌套。
App组件要写成下面的样子。
export default React.createClass({
render() {
return
{this.props.children}
}
})
这样App 岂不是 失去了自己的定义
如果写成下面,会发生什么? _ques
export default React.createClass({
render() {
return
{this.props.children}
}
})
路径匹配的通配符取值
:paramName
:paramName匹配URL的一个部分,直到遇到下一个/、?、#为止。这个路径参数可以通过this.props.params.paramName
是怎么取得? _ques
URL的查询字符串/foo?bar=baz,可以用this.props.location.query.bar获取。同问? _ques
link组件
Link组件用于取代元素,可以接收Router的状态。 _ques
histroy 属性
hashHistory 最适合只有browser的应用。通过hash切换
browserHistory 需要改造服务器,请求浏览器的api History API。显示正常的路径
createMemoryHistory
对于 browserHistory
如果开发服务器使用的是webpack-dev-server,加上–history-api-fallback参数就可以了。
$ webpack-dev-server –inline –content-base . –history-api-fallback _ques
用于表单中路径的跳转。此为方法1。
表单路径跳转还可以
使用context对象,方法2.
export default React.createClass({
// ask for router
from context
contextTypes: {
router: React.PropTypes.object
},
handleSubmit(event) {
// …
this.context.router.push(path)
},
})
难道就不能直接使用 hashHistory跳转?方法3。 _ques
正在准备一个react webapp,上述问题,等待我实践中验证。