React Router Dom v6 - 重定向到另一条路线

Question

我正在使用以下路由器配置：

<Routes>
  <Route path="/" element={<Home />} />
  <Route path="/information" element={<Information />} />
  <Route path="*">
    <Navigate to="/" replace={true} />
  </Route>
</Routes>

每次输入路由器无法识别的路由时，我都想导航到 home 路由和 Home 组件。从 v6 开始，没有重定向组件，所以我尝试使用 Navigate。

为什么我的配置不起作用？

Answer 1

复制Redirect的新syntax/pattern是将Navigate渲染为路由element，并指定replace属性。

RRDv5: <Redirect from="*" to="/" />

RRDv6: <Route path="*" element={<Navigate to="/" replace />} />

React Router Dom v6 - 重定向到另一条路线

React Router Dom v6 - redirecting to another route

navigation

redirect

typescript

reactjs

react-router-dom