Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

646
Vistas
How to implement a remember me function using React JS

I am trying to username is set to remember me functionality but I don't have any idea how to set remember me functionality, using local storage below is my code please check it and let me know if any suggestions I have used Local Storage. I am new to React JS.

Below is my code, please give me solutions.

const Login = () => {
  const navigate = useNavigate(); //navigate to next step
  const [items, setItems] = useState(); //variable for store api response
  const [error, setError] = useState({ type: '', message: '' })//res type and res Error show with loop
  const rmCheck = document.getElementById("rememberMe");
  const username = document.getElementById("username");//remember me variable
  const {
    register,
    handleSubmit,
    formState: { errors },
    reset,
  } = useForm(); //form Input using useform
  const onSubmit = (data) => {
    console.log(items);
    axios.post(`https://lt-hrm.herokuapp.com/api/v1/2022/user/login`, data)
      .then((res) => {
        setItems(res);
        console.log(res);
        localStorage.setItem('username',JSON.stringify(res.data.username));
        localStorage.setItems("token", JSON.stringify(res.data.token));
        if (res.status === 200 || res.message === 'Login Succesful') {
          setError({type:'success',message:`${res.data.message}`})
          const timeout = setTimeout(() => {
             navigate("/campaign-details")
          }, 2000);
          return () => clearTimeout(timeout);
        }
        else if (res.status === 201 || res.statusText === "Created") {
          setError({ message: `${res.data.message}` })
          const timeout = setTimeout(() => {
           setError({type:'error' , message:""})
          }, 2000);
          return () => clearTimeout(timeout);
        }
        else {
        }
        // if (localStorage.checkbox && localStorage.checkbox !== "") {
        //   rmCheck.setAttribute("checked", "checked");
        //   username.value = localStorage.username;
        // } else {
        //   rmCheck.removeAttribute("checked");
        //   username.value = "";
        // }
        reset();
      });
  }; //fuction for form submit 
function RememberMe() {
  console.log('hii');
  // if (rmCheck.checked && username.value !== "") {
  //   localStorage.username = username.value;
  //   localStorage.checkbox = rmCheck.value;
  // } else {
  //   localStorage.username = "";
  //   localStorage.checkbox = "";
  // }
}
about 4 years ago · Juan Pablo Isaza
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 Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda