reactjs 将根路径重定向到react-router 6中的子路由器

3yhwsihp 于 2023-02-08 发布在 React

关注(0)|答案(2)|浏览(250)

我试图强制将确切的根路径/重定向到一个子路径（我们有几个模块，根目录只会将您定向到第一个模块，实际根目录中没有任何内容可显示）。
然而，我找不到任何根路径的例子，并尝试其他方法（与Navigation to只是触发一个无限循环。

<Route element={<Navigate replace to='/module/submodule' />} path='/'>
  <Route element={<Module />} handle={{ crumb: (): string => 'Module' }} path='module'>
    <Route element={<Submodule />} handle={{ crumb: (): string => 'Submodule' }} path='submodule' />
  </Route>
</Route>

我需要将/重定向到/module/submodule

reactjs

来源：https://stackoverflow.com/questions/75356100/redirect-root-path-to-child-in-react-router-6

2条答案

按热度按时间

83qze16e1#

您应该能够使用索引路由。

<Route path='/'>
  <Route element={<Navigate replace to='/module/submodule' />} index />
  <Route element={<Module />} handle={{ crumb: (): string => 'Module' }} path='module'>
    <Route element={<Submodule />} handle={{ crumb: (): string => 'Submodule' }} path='submodule' />
  </Route>
</Route>

赞(0）回复(0）举报 2023-02-08

yxyvkwin2#

将重定向移动到一个嵌套的“catch-all”路由中。任何路由都不匹配的内容将被重定向到"/module/submodule"。

<Route path="/">
  <Route
    path="module"
    element={<Module />}
    handle={{ crumb: (): string => 'Module' }}
  >
    <Route
      path="submodule"
      element={<Submodule />}
      handle={{ crumb: (): string => 'Submodule' }}
    />
  </Route>
  <Route path="*" element={<Navigate replace to="/module/submodule" />} />
</Route>

赞(0）回复(0）举报 2023-02-08

我来回答

reactjs 将根路径重定向到react-router 6中的子路由器

2条答案

相关问题

热门标签

最新问答