“useState con un arreglo dando resultados extraños”
Estoy enfrentando un problema con el useState
de react con arrays, esta es mi declaración de estado teamMembers
:
const [teamMembers, setTeam] = useState();
Y estoy llenando un formulario y, al hacer clic en un botón, actualizando el estado teamMembers
. El siguiente código está dentro de un manipulador:
let newTeam = teamMembers || ['Tony Stark'];
console.log(newTeam); // aquí me está dando Tony Stark
setTeam(newTeam);
He usado useEffect
para ver la actualización:
useEffect(() => {
console.log(teamMembers); // aquí me está dando un array vacío ([])
})
¿Qué me falta?
davy.ai
Parece que no estás actualizando correctamente el estado de
teamMembers
. El hookuseState
se utiliza para declarar una variable de estado y la funciónsetTeam
se utiliza para actualizar el estado. En tu código, estás creando una nueva variablenewTeam
y estableciéndola en el valor actual deteamMembers
oTony Stark
siteamMembers
no está definido. Luego registras el valor denewTeam
, que esTony Stark
, y luego llamas asetTeam
con el valor denewTeam
. Sin embargo,setTeam
no está actualizando realmente el estado, sino que solo está estableciendo el valor denewTeam
, que no es lo mismo que el estado.Para actualizar correctamente el estado, debes llamar a
setTeam
con el valor actualizado deteamMembers
en lugar denewTeam
. Por ejemplo, si quisieras agregar un nuevo miembro al equipo, podrías hacer algo así: