1

Estoy intentando obtener el value del select para setearle el valor a la variable typeOp del useState

introducir la descripción de la imagen aquí

si elijo la opcion egreso, por consola muestra "ingreso" y si seguidamente elijo la opcion ingreso por consola muestra "egreso". ¿Por qué sucede esto?

aca mi código:

const [typeOp, setTypeOp] = React.useState('ingreso');


const captureType = (e) => {
  setTypeOp(e.target.value);
  console.log(typeOp);
}

return (

  <Form.Control as="select" onChange={captureType}>
      <option value={typeOp}>Ingreso</option>
      <option value="egreso">Egreso</option>
  </Form.Control>

);

1 respuesta 1

1

Ese problema en parte es porque ese console.log() te muestra el valor del estado typeOp antes de ser seteado.

Si pondrías el console.log() entre el captureType y el return podrías ver el estado ya actualizado.

Pero aun haciendo eso todavía habría un error por corregir.

El problema principal es el value que le estás poniendo al primer <option>.

No debería ser {typeOp} porque así como está tomará el valor del estado que cuando llegue a tener el valor de "Egreso" ya no volverá a cambiar más.

Para corregirlo deberías cambiar el value de la primer opción y la posición del console.log() así:

const [typeOp, setTypeOp] = React.useState('ingreso');

const captureType = (e) => {
    setTypeOp(e.target.value);
}

console.log(typeOp);

return (

    <Form.Control as="select" onChange={captureType}>
        <option value="ingreso">Ingreso</option>
        <option value="egreso">Egreso</option>
    </Form.Control>

);
1
  • 1
    gracias @Desarrollos-Web-Urquiza funciona correctamente!
    – Claudio
    Commented el 10 may. 2021 a las 20:38

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.