0

Estoy aprendiendo React y tengo un problema con useState, necesito que se actualice después de escribir 5 caracteres en un input. Se que el problema tiene que ver con la asincronía de useState, sin embargo no he podido resolverlo.

  const [codigoInfo,setcodigoInfo]= useState({
    state:'',
    info:[]
  })

    ------------------------------------
    const cpChange = (e) => {
    e.persist();
    setRFC({...rfc, [e.target.name]: e.target.value});
    console.log(e.target.value.length)
    if(e.target.value.length === 5){
     setcodigoInfo({...codigoInfo,state:'exito'})
     console.log(codigoInfo)   
       }
     }

Digamos que al poner los 5 números en el input, la primera vez en el console.log el state aparece como state: " " , al borrar algun caracter y escribir otro, el state si hace el update. Quisiera hacer este set desde el inicio.

1
  • Bienvenido a Stack Overflow Español, tu pregunta es muy popular en la comunidad, por favor revisa alguna de estas publicaciones React async 1, React Async 2 puede que aclares tus dudas, si consideras que alguna fue de utilidad vota por ella, saludos.
    – g.4
    Commented el 12 feb. 2021 a las 0:58

1 respuesta 1

0

No vas a poder obtener el valor actualizado de codigoInfo dentro de la misma función donde lo estas seteando.

Cuando acabe de procesar la función entera de cpChange, es cuando el componente se va a renderizar de nuevo con los cambios que has hecho en el codigoInfo aplicados, dentro de la misma función no vas a tener nunca el valor actualizado.

Si pones ese mismo console.log fuera de la función, pero dentro del componente, verás que cada vez que el componente renderize te va a mostrar el valor de codigoInfo, y en el momento que llegue a los 5 carácteres se mostrará actualizado.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.