[英]Passing state to react-router 1.x
In react-router
version 0.13.3 I have 在
react-router
版本0.13.3我有
Router.run(routes, createBrowserHistory, function(Handler, state) {
React.render(<Handler query={ state } path={ state.pathname }/>, document.getElementById('app'))
});
In react-router
1.0.0.rc3 I have 在
react-router
1.0.0.rc3我有
let history = createBrowserHistory();
React.render(<Router history={ history } >{ routes }</Router>, document.getElementById('app'));
With react-router
0.13.3, I was able to pass state to my Components with a callback. 使用
react-router
0.13.3,我能够通过回调将状态传递给我的组件。 I was wondering how I can do the same with version react-router
1.x ? 我想知道如何使用版本
react-router
1.x做同样的事情?
React Router 1.0 now creates elements from your route components, passing them the following routing-related state as props by default: React Router 1.0现在创建路由组件中的元素,默认情况下将以下路由相关状态作为props传递给它们:
history
- a History object history
- 历史对象 location
- a Location object location
- 位置对象 params
- parameters extracted from the URL params
- 从URL中提取的参数 route
- the route object the rendered component belongs to route
- 呈现的组件所属的路由对象 routeParams
- parameters extracted from the URL for the route object the rendered component belongs to routeParams
- 从呈现的组件所属的路由对象的URL中提取的参数 routes
- an array of all the route objects which were matched routes
- 匹配的所有路由对象的数组 You should be able to use these to get a hold of routing-related state, eg to get the pathname, you could use this.props.location.pathname
inside a route component, or pass these onto children which need them. 您应该能够使用这些来获取与路由相关的状态,例如,为了获取路径名,您可以在路由组件中使用
this.props.location.pathname
,或将这些传递给需要它们的子项。
The 1.0 upgrade guide has more details about this . 1.0升级指南有关于此的更多详细信息 。
If you want to pass additional props to an individual route component when rendering it, you can use React.cloneElement()
like so: 如果要在渲染时将其他道具传递给单个路径组件,可以像这样使用
React.cloneElement()
:
{React.cloneElement(this.props.children, {extra: 'extra prop'})
If you want to pass additional props when a route component element is being created, you can pass a custom createElement()
function to <Router>
. 如果要在创建路径组件元素时传递其他道具,可以将自定义
createElement()
函数传递给<Router>
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.