React Router v6 - 创建无效路径重定向

Question

我想这样做，以便如果用户在 URL 中输入无效路径，它会自动将其重定向到主页。

像这样的东西：

<BrowserRouter>
    <Routes>
        <Route exact path="/" element={<Home />}/>
        <Route exact path="/page" element={<page />}/>
        <Route path="*" /*Go to path - "/" */ />
    </Routes>
</BrowserRouter>

Answer 1

将重定向渲染为路由组件，在本例中Navigate为replace指定了 prop 的组件。

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