如何在React中用于认证的模式化路线（附代码）我有一个反应应用程序，我想创建一个模态链。例如，当我点击登录时，我想打开

我有一个反应应用程序，我想创建一个模态链。例如，当我点击登录时，我想打开一个模态，该模态重定向到另一个模态，并可以返回。

我还使用了react-router 和react-router-dom v6

我试过这个实现，它只对第一个模态有效，但对其他模态无效，我不知道为什么。

index.js 我所有的路线在哪里？

<Routes location={background || location}>
  <Route path={routeConstants.LAYOUT} element={<Layout />}>
  <Route path={routeConstants.POSTS} element={<Posts />} />
  ...
  <Route path="*" element={<Navigate to={routeConstants.POSTS} />} />
</Routes>
{background && (
   <Routes>
     <Route path="/auth" element={<AuthEntry />} />
     <Route path="/auth/login/email" element={<EmailLogin />} />
     <Route path="/auth/login/password" element={<PasswordLogin/>} />
   </Routes>
)}

这里是我如何导航到我的模态路线的地方

navigate('/auth', { replace: true, state: { background: location } });

问题是我不能到达第二个模态。在我的第一个模态中使用这个，但不工作：

navigate('/auth/login/email', {
   replace: true,
   state: { background: location },
})