Como bien dice la pregunta, quiero que al renderizarse un componente se verifique el valor de una variable, y depende de ello redireccionar a un sitio u otro. Lo que tengo es:
import React, { useEffect } from 'react';
import { connect } from 'react-redux'
import { Redirect } from 'react-router-dom';
const Home = ({ loggedIn }) => {
useEffect(() => {
console.log(loggedIn);
}, [])
return (
<div className='row'>
<div className='col-12'>
<p>Home</p>
</div>
</div>
);
};
const mapStateToProps = state => ({
loggedIn: state.auth.isLoggedIn
})
export default connect(mapStateToProps)(Home)
Cuando yo entro al sitio recibo correctamente el valor de la variable loggedIn
en consola. Ahora, quisiera ejecutar algo así:
useEffect(() => {
loginRedirect();
},[])
const loginRedirect = () =>{
return loggedIn ? <Redirect to='/profile' /> : <Redirect to='/registrar' />
}
Es decir, verificar la variable y redireccionar a profile
o a registrar
. Pero recibo el error:
React Hook useEffect has a missing dependency: 'loginRedirect'. Either include it or remove the dependency array react-hooks/exhaustive-deps
Supongo que estoy cerca de la solución pero estoy implementando algo mal.
Agradezco cualquier sugerencia.