1 year ago
#93617

Imen
Remember me functionality with react js
I am developing a login page using react js, I want to add a remember me checkbox, I'm trying to set the value of the checkbox in localStorage
, and in my AppContent file, I implement my condition if the checkbox is true, redirect me to the login page else redirect me to the dashboard. Can anyone give me some idea why this is not working for me?
Login.js
const handleSubmit = () => {
let items = { email, password }
let body = JSON.stringify(items)
const headers = {
'Content-Type': 'application/json',
'Accept': 'application/json',
};
axios.post(`****/api/login`, body, { headers })
.then(response => {
{ checked ? localStorage.setItem('check', true) : localStorage.setItem('check', false) }
localStorage.setItem('tokenLod', response.data.token);
localStorage.setItem('loginLod', true);
history.push('/')
})
.catch(error => {
console.log("error", error)
})
}
<Form.Check
required
label="Souviens-toi de moi"
feedback="You must agree before submitting."
value={checked}
onChange={() => setChecked(!checked)}
/>
AppContent.js
const AppContent = () => {
return (
<CContainer lg>
<Suspense fallback={<CSpinner color="primary" />}>
<Switch>
{routes.map((route, idx) => {
return route.component ? (
<Route
key={idx}
path={route.path}
exact={route.exact}
name={route.name}
render={props =>
(localStorage.getItem('tokenLod') && localStorage.getItem('loginLod'))
? (
<route.component {...props} />
) : (
<Redirect to={{ pathname: "/login" }} />
)
}
/>
) : null;
})}
localStorage.getItem('check') === true ?
<Redirect to={{ pathname: "/login" }} /> :
<Redirect to={{ pathname: "/dashboard" }} />}
</Switch>
</Suspense>
</CContainer>
)
}
reactjs
jwt
remember-me
0 Answers
Your Answer