React 路由器：嵌套资源答案

【问题标题】：React router: nested resourcesReact 路由器：嵌套资源
【发布时间】：2016-08-09 16:39:28
【问题描述】：

我有两条路线：

/resource/1/

/resource/1/nested_resource/2

以及适当的<Link /> 组件。当我去路由/resource/1/-只有转发到/resource/1/ 的链接有active 类。

但是当我转到/resource/1/nested_resource/2 路径时，/resource/1/ 和/resource/1/nested_resource/2 的链接有活动课程。

在第二种情况下，有没有办法只为嵌套路由链接（如/resource/1/nested_resource/2）提供活动类？

 <Route path='/' component={Layout}>
  <IndexRoute component={Index} />
  <Route path='resource' >
    <IndexRoute component={Resources} onEnter={onEnter} />
    <Route path='new' component={NewResource} />
    <Route path=':resourceId' onEnter={onEnter}>
      <IndexRoute component={ShowResource} onEnter={onEnter} />
      <Route path='nested_resource' >
        <Route path=':nestedResourceId' component={NestedResource} />
        <Route path='new' component={NestedResourceNew} />
      </Route>
    </Route>
  </Route>
</Route>

【问题讨论】：

标签： javascript reactjs redux react-router

【解决方案1】：

您可以使用，它仅在父路由匹配时才会激活。

react-router documentation 说 -

如果您要在此应用程序中首页，它总是由于每个 URL 都以 / 开头，因此处于活动状态。这是一个问题，因为我们想链接到 Home，但只有在 Home 被渲染时才处于活动状态。

拥有一个指向 / 的链接，仅在 Home 路由为渲染后，使用 Home。

【讨论】：