嵌套在默认路由中

Question

我有一个应用程序索引页面，其中列出了我所有的应用程序。索引页面也是默认路由。我想在索引页中嵌套一个 'applications new' 模式。这样我就可以在索引页面顶部呈现模态。但是，我无法成功嵌套在默认路由中。

这是我认为它应该如何工作

<Route name='applications' path='/applications' handler={Applications}>
  <DefaultRoute name="index" handler={ApplicationIndex}>
    <Route name='applicationNew' path='/new' handler={ApplicationNewModal}/>
  </DefaultRoute>
  <Route name="applicationShow" path=':key' handler={ApplicationShow}/>
</Route>

当我尝试转换到 'applicationNew' 时，我收到一条错误消息，提示未找到具有该名称的路由

Answer 1

您需要将它移动到具有 handler={ApplicationIndex} 的路线内的自己的路线。

<Route name='applications' path='/applications' handler={Applications}>
  <DefaultRoute name="index" handler={ApplicationIndex} />
  <Route handler={ApplicationIndex}>
    <Route name='applicationNew' path='/new' handler={ApplicationNewModal} />
  </Route>
  <Route name="applicationShow" path=':key' handler={ApplicationShow}/>
</Route>

嵌套在默认路由中

Nesting in Default Route

javascript

reactjs

react-router