如何使用呈现在路径成分从反应路由器（V4）时通过匹配

Question

当声明这样的路线：

App.js

<Route path="/:id" component={RunningProject} />

我可以得到在id PARAM RunningProject.js这样

constructor(props){ 
    super(props) 
    console.log(props.match.params.id); 
} 

但在宣布路线这样

时

<Route path="/:id" render={() => <RunningProject getProjectById={this.getProject} />} />

我得到一个错误，因为匹配不再传递到道具。

如何使用render=而不是component=将匹配对象传递到props？

Answer 1

为了通过你需要解构作为参数传递给呈现回调像这样的对象匹配对象：

<Route path="/:id" render={({match}) => <RunningProject getProjectById={this.getProject} match={match} />} />

您还可以得到其他对象，这里的对象列表通过：

• history
• location
• staticContext
• match

或者你可以只通过整个对象，并在收件人组件

<Route path="/:id" render={(obj) => <RunningProject getProjectById={this.getProject} obj={obj} />} />

解构