• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Pruebas Online
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

115
Vistas
Quiero restringir el enrutamiento de la página cuando el usuario inicia sesión

Creé una aplicación en la que estoy implementando el enrutamiento usando react-router-dom.

Entonces, el escenario es cuando un usuario inicia sesión, se le redirige a localhost: 3000/ URL de inicio y se muestra la página de inicio. Cuando cierra la sesión, llega a la página de destino que se encuentra en localhost:3000 .

Pero si el usuario cambia la url a localhost:3000 cuando inicia sesión, todo queda en blanco y se muestra como iniciado sesión, creo que este es el comportamiento predeterminado de enrutamiento.

El requisito es redirigir al usuario a la página de inicio hasta que inicie sesión, incluso si cambia la URL escribiendo localhost en el navegador.

almost 3 years ago · Juan Pablo Isaza
3 Respuestas
Responde la pregunta

0

agregue una condición para verificar si el usuario inició sesión y use Navigate from react-router-dom para redirigir al usuario. agrega esto en tu componente

 return ( { ("add condition here to check if user is login") ? ( <Navigate to="/home " /> ) : (<div>Component body</div>) } )
almost 3 years ago · Juan Pablo Isaza Denunciar

0

Intente, si no inicia sesión, redirija a la página de inicio de sesión y el usuario de inicio de sesión luego redirige a la página de inicio de sesión.

 <HashRouter> {!auth.token && ( <Routes> <Route path="/" element={<Login />} /> <Route path="*" element={<Navigate to="/" />} /> </Routes> )} {auth.token && ( <> <Routes> <Route exact path="/home" element={<Home />} /> <Route path="*" element={<Navigate to="/home" />} /> </Routes> </> )} </HashRouter>

almost 3 years ago · Juan Pablo Isaza Denunciar

0

Hola, tu problema es fácil de resolver, solo estructura tus rutas de esta manera:

 <Route exact path="/login" render={() => { if (userLoggedIn) { return <Redirect to="/home" />; } return <LoginPage />; }} />

O hazlo de esta manera:

 <Route exact path="/home" render={() => { if (!userLoggedIn) { return <Redirect to="/login" />; } return <HomePage/>; }} />

Espero que esto te ayude, si necesitas alguna otra aclaración, por favor mencióname en los comentarios a continuación.

almost 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda