es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

La variable está indefinida dentro del setter de useState.

26 Jul, 2023 Programación

He implementado la siguiente función para manejar la entrada de texto:

const handleChange = input => e => {
    const val = e.target.value.trim();
    val &&
        setValues(v => ({
            ...v,
            [input]: val,
        }));
};

He definido values de la siguiente manera:

const [values, setValues] = useState({
        name: '',
        description: '',
        someExtraFields: ''
});

La función se llamaría de la siguiente manera:

<input
  onChange={handleChange('name')}
/>

El código anterior funciona bien, sin embargo, la versión a continuación no lo hace. Lanza el error cannot read value of undefined.

No estoy seguro de por qué esto sucede, ya que cuando intento registrar e.target.value() antes de la llamada a setValues, funciona bien. ¿Hay algo que me esté perdiendo en relación a su uso dentro del método setValues?

const handleChange = input => e => {
    e.target.value &&
        setValues(v => ({
            ...v,
            [input]: e.target.value.trim();,
        }));
};
Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    El problema con la segunda versión de la función handleChange es que hay un error de sintaxis en la línea donde se llama a setValues. En lugar de pasar el valor de e.target.value.trim(), hay un punto y coma al final de esa línea, lo que causa el error.

    Para solucionar este error, simplemente elimine el punto y coma al final de la línea de esta manera:

    const handleChange = input => e => {
    e.target.value &&
        setValues(v => ({
            ...v,
            [input]: e.target.value.trim(),
        }));
};

    Después de realizar este cambio, la función debería funcionar como se espera sin errores.

Comments are closed.