通過道具來反應路線

Question

我在Main中有一個快餐欄處理程序，我想將它作為道具傳遞給每個Route組件。 我該如何實現？

<Router history={browserHistory}>
  <Main history={browserHistory}>
    <Switch>
      <Route path="/comp1" component={comp1} />
      <Route path="/comp2" component={comp2} />
      <Route path="/comp3" component={comp3} />
      <Route path="/comp4" component={comp4} />
    </Switch>
  </Main>
</Router>

Answer 1

您可以在props中傳遞props，包括綁定的事件處理程序，如下所示：

<Route exact path={'/:userId/create-project/:projectId'}  component={() => {
      return (
        <ProjectEditor
          goToDashboard={this.goToDashboard}
          nextProject={this.state.nextProject}
          goToProject={this.goToProject}   
          updateUserProject={api.updateUserProject}              
        />
      )
   }} 
/>

Answer 2

您可以將組件放置在Route中，並在此處傳遞任何道具。

<Route path="/comp1"><Comp1 myHandler={MyHAndler}/></Route>

Comp1也從Route獲取所有道具。