如何在带有动态URL的Route中传递变量？

Question

我一直试图解决将变量值从主组件(App.js)传递到子组件Attendees.js的问题。路线如下

App.js

<Router>
     ...
     <Route path="/attendees/:userID/:meetingID" component={Attendees} 
      adminUser={this.state.userId}/>} />
</Router>

Attendees.js

componentDidMount(){
    const meetingID = this.props.match.params.meetingID
    const adminUser = this.props.adminUser
}

我无法检索作为道具传递的adminUser（adminUser变得未定义）。但是我能够执行URL中编码的变量(meetingID, userID)。 如何在子组件中获取值adminUser。

Answer 1

您可以渲染一个匿名组件并将adminUser道具插入其中。不要忘记同时代理路线道具。

<Router>
  ...
  <Route
    path="/attendees/:userID/:meetingID"
    component={routeProps => (
      <Attendees {...routeProps} adminUser={this.state.userId} />
    )} 
  />
</Router>