Estaba tratando de implementar enlaces profundos (no estoy seguro si este es el término correcto) en mi proyecto de reacción, lo que quiero hacer es esto:
el administrador recibe un correo: "este usuario no puede iniciar sesión: http://localhost:3000/admin/customer-profile/b1d4a11f-4f6c-4dc1-98a9-ac0c30486c16"
el administrador no ha iniciado sesión
el administrador hace clic en el enlace y es reenviado a la página de inicio de sesión
el administrador ingresa sus datos de inicio de sesión
(la parte nueva)
entonces, en el quinto punto, el administrador es redirigido a la página para la que estaba el enlace en lugar de ir a la página de inicio.
A continuación hay algunos fragmentos para dar más información sobre esto:
<div className="App"> {ready && <Router basename="/admin"> <Switch> <Route path="/login"> <Login /> </Route> <Route path="/privacypolicy"> <PrivacyPolicy /> </Route> <Route path="/loginhelp"> <Help /> </Route> <Route path="/termsconditions"> <TermsConditions /> </Route> <PrivateRoute path="/logout"> <Logout /> </PrivateRoute> <Route path="/"> <SideBar /> <Switch> <PrivateRoute path="/tier-list"> <TierList /> </PrivateRoute> <PrivateRoute path="/privacy-policy"> <PrivacyPolicy /> </PrivateRoute> <PrivateRoute path="/help"> <Help /> </PrivateRoute> </Switch> </Route> </Switch> </Router>} </div>A continuación se muestra cómo se ve PrivateRoute:
function PrivateRoute({ children, ...rest }: any) { return ( <Route {...rest} render={({ location }) => userInfo != null ? ( children ) : ( <Redirect to={{ pathname: "/login", state: { from: location } }} /> ) } /> ) }¿Alguna idea de cómo modificaré esta parte para lograr la funcionalidad?
Bien, entonces resolví el problema. Lo que hice fue que pasé un accesorio pathName al componente de inicio de sesión y luego, si el usuario había iniciado sesión, lo redirigí a esa página, pero si no, procesé la página de inicio de sesión.