v6 中重定向的正确过程是什么？我以前在 v5 中使用以下代码，效果很好：
<Route path="/login">
{user ? <Redirect to="/" /> : <LoginStandard />}
</Route>
但是，我想在这个版本中使用相同的逻辑。当我的用户登录后，我想重新定向。
<Route path="/login">
<Route index element={<LoginStandard />} />
</Route>
使用Navigate组件进行重定向。仍然需要应用条件渲染逻辑，并在Route组件的elementprop 上渲染出组件。
例子：
<Route
path="/login"
element={user ? <Navigate to="/" replace /> : <LoginStandard />}
/>
将其抽象为自定义路由保护组件通常被认为是更好的做法，该组件有条件地呈现Outlet嵌套路由或Navigate组件。
例子：
import { Navigate, Outlet } from 'react-router-dom';
const AnonymousRoute = ({ user }) => user
? <Navigate to="/" replace />
: <Outlet />;
...
<Route element={<AnonymousRoute user={user} />}>
<Route path="/login" element={<LoginStandard />} />
... other anonymous routes ...
</Route>
... other routes
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句