如何在特定路线上使用react-router获取布局上的组件?

时间:2017-05-06 06:58:47

标签: reactjs react-router

我有一个index.js文件,其中包含所有路径。

<Router history={hashHistory}>
    <Route path="/" component={Layout}>
      <IndexRedirect to={'dashboard'}/>
      <Route path="dashboard" component={Dashboard} />
      <Route path="donors" >
        <IndexRoute component={Donors} />
        <Route path=":id" component={SingleDonor} />
      </Route>
      <Route path="repository" component={Repository} />
      <Route path="groups"  background={'premium'} premiumText={'groups is a premium feature'}>
        <IndexRoute component={Groups} />
        <Route path=":name" component={SingleGroup} />
      </Route>
      <Route path="campaigns" component={Campaigns} background={'premium'} premiumText={'campaings is a premium feature'}/>
      <Route path="followups" component={Followups} background={'premium'} premiumText={'followups is a premium feature'} />
      <Route path="settings" component={Settings}  background={'premium'} premiumText={'settings is a premium feature'}/>
      <Route path="subscriptions" component={Subscription} background={'premium'} premiumText={'creating a great product for the best price'} />
    </Route>
    <Route path="*" component={NotFound} />
  </Router>

我想只在用户在/donor/1路径

上时才在Layout.js的TopMenu组件中显示一个组件

这是我的布局渲染方法

<div>
      <Sidebar userData={this.state.userData} ngo={this.state.ngo}
              lockPortal={this.lockPortal}
      />
      <TopMenu userData={this.state.userData}
              logoutUser={this.logoutUser}
      />
      {React.cloneElement(this.props.children, { ngo: this.state.ngo })}
</div>

这是什么解决方案。此外,如果这是重复,有人可以请我重定向到可能的解决方案,因为我无法找到它。提前谢谢。

0 个答案:

没有答案