There are many solutions to pass props to a child component via React Router, and some you’ll find are outdated.
有很多解决方案可以通过React Router将prop传递给子组件,有些则已经过时了。
The most simple ever is adding the props to the Route wrapper component:
最简单的方法是将道具添加到Route包装器组件:
const Index = props => <h1>{props.route.something}</h1>
var routes = <Route path="/" something={'here'} component={Index} />
But in this way you need to modify how you access props, via this.props.route.*
instead than the usual this.props
, which might or might not be acceptable.
但是以这种方式,您需要通过this.props.route.*
而不是通常的this.props
来修改访问道具的this.props
,这可能会或可能不会被接受。
A way to fix this is to use:
解决此问题的一种方法是使用:
const Index = props => (
<h1>{props.something}</h1>
)
<Route path="/" render={() => <Index something={'here'} />} />