React-Router:IndexRoute 的目的是什么?

IT技术 javascript reactjs react-router url-routing
2021-05-14 23:53:36

我不明白使用IndexRouteIndexLink的目的是什么似乎在任何情况下,下面的代码都会首先选择 Home 组件,除非 About 路径被激活。

<Route path="/" component={App}>
  <IndexRoute component={Home}/>
  <Route path="about" component={About}/>
</Route>

对比

<Route path="/" component={App}>
  <Route path="home" component={Home}/>
  <Route path="about" component={About}/>
</Route>

第一种情况的优势/目的是什么?

1个回答

在上面例子中,将/会使AppHome作为一个孩子通过。在底部的例子,要/会使得App既不 Home也不About被渲染,因为无论他们的路径都不匹配。

对于旧版本的 React Router,相关版本的索引路由和索引链接页面上提供了更多信息从 4.0 版本开始,React Router 不再使用IndexRoute抽象来实现相同的目标。