javascript - 如何在 ReactJS 中具有动态 URL 的 Route 中传递变量？

Question

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

应用程序.js

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

与会者.js

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

我无法检索作为道具传递的 adminUser。（adminUser 越来越未定义）。但我可以做(meetingID, userID)在 URL 中编码的变量。如何获取adminUser子组件中的值。

标签： javascriptreactjsreact-router

Answer 1

您可以渲染一个匿名组件并将adminUser道具滑入。不要忘记代理路由道具。

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