如何在Reaction路由器V6中重定向?
我正在尝试升级以响应路由器V6(react-router-dom 6.0.1
)。
以下是我的更新代码:
import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom';
<BrowserRouter>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/lab" element={<Lab />} />
<Route render={() => <Navigate to="/" />} />
</Routes>
</BrowserRouter>
最后一个Route
正在将其余路径重定向到/
。
但是,我收到一个错误
TS2322:不能将类型‘{Render:()=>;Element;}’赋值给类型‘IntrinsicAttributes&;(PathRouteProps|LayoutRouteProps|IndexRouteProps)’。*类型‘IntrinsicAttributes&;(PathRouteProps|LayoutRouteProps|IndexRouteProps)’上不存在属性‘Render’。但是,基于the doc,它确实有
render
forRoute
。如何正确使用?
解决方案
我认为您应该使用不匹配的路由方法。
请在文档中查看此信息。
https://reactrouter.com/docs/en/v6/getting-started/tutorial#adding-a-no-match-route
import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom';
<BrowserRouter>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/lab" element={<Lab />} />
<Route
path="*"
element={<Navigate to="/" />}
/>
</Routes>
</BrowserRouter>
相关文章