La variable está indefinida dentro del setter de useState.
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();,
}));
};
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 asetValues
. En lugar de pasar el valor dee.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:
Después de realizar este cambio, la función debería funcionar como se espera sin errores.