Quiero iniciar sesión solo cuando isLoggedIn es verdadero, de lo contrario estará en "/login". si isLoggedIn es verdadero, debería ir a "/dispositivo"
Intenté usar el operador ternario pero no funciona, ¿cómo puedo usar el enlace para mover diferentes páginas dinámicamente?
Entonces, si entiendo su pregunta correctamente, desea que un usuario pueda hacer clic en un enlace de "inicio de sesión" y realizar una solicitud POST al punto final "/ api/userCheck". Dependiendo de la respuesta, desea navegar condicionalmente a "/dispositivos" o "/iniciar sesión" ( permanecer en la misma página ).
Para esto, deberá evitar que la "acción" predeterminada de hacer clic en el enlace active la navegación y llamar a la devolución de llamada handleLoginClick , luego emitir una navegación imperativa a la ruta de destino.
handleLoginClick(e) { e.preventDefault(); const { pass, user } = this.state; axios.post( "http://localhost:3001/api/userCheck", { email: user, password: pass } ).then(res => { if (res.data.login) { this.setState({ fname: res.data.fname }); this.setState({ isLoggedIn: true }); localStorage.setItem('loginstatus', true); this.props.history.replace("/device"); } else { this.setState({ isLoggedIn: false }); this.props.history.replace("/login"); } }).catch(err => { this.setState({ isLoggedIn: false }); this.props.history.replace("/login"); }); }Asegúrese de que el evento de clic se pase a la devolución de llamada.
<Link onClick={this.handleLoginClick} // <-- set handleLoginClick directly as callback to="/devices" className="btn btn-pink my-3" > <i className="fas fa-lock"/> Login </Link>