¿Por qué React solo guarda el último elemento en mi matriz? Tengo dos elementos, mapeo sobre ellos y solo el último elemento se coloca en el gancho cada vez.
React.useEffect(() => { if (bearbeiten) { handleClickUserList(bearbeiten.user); setBeschreibung(bearbeiten.beschreibung); setKontaktNamenData([]); { bearbeiten.freunde?.map((freund) => { setKontaktNamenData([...kontaktNamenData, freund.id]); }); } } }, [bearbeiten]); La matriz pasada contiene dos objetos de tipo Amigos: 
Sin embargo, al guardar, solo se muestra o acepta el último elemento de la matriz de ganchos: 
Está poniendo en cola las actualizaciones de estado en un bucle, pero no utiliza una actualización de estado funcional. Esto significa que cada vez se utiliza el mismo kontaktNamenData actual del gabinete. Cada actualización de estado en cola sobrescribe la actualización anterior, por lo que la última actualización procesada es la que tiene el valor para el próximo ciclo de procesamiento.
Una actualización de estado funcional se actualizará correctamente desde el estado anterior en lugar del valor obsoleto del gabinete.
Ejemplo:
React.useEffect(() => { if (bearbeiten) { handleClickUserList(bearbeiten.user); setBeschreibung(bearbeiten.beschreibung); setKontaktNamenData([]); bearbeiten.freunde?.map((freund) => { setKontaktNamenData(kontaktNamenData => [ ...kontaktNamenData, freund.id ]); }); } }, [bearbeiten]);Alternativamente, puede poner en cola una actualización de estado único y mover la asignación de amigos a la actualización de estado funcional.
Ejemplo:
React.useEffect(() => { if (bearbeiten) { handleClickUserList(bearbeiten.user); setBeschreibung(bearbeiten.beschreibung); setKontaktNamenData((bearbeiten.freunde || []).map((freund) => freund.id)); } }, [bearbeiten]);El valor actual de su variable no se actualiza durante la misma iteración del ciclo, por lo que sus llamadas a setKontaktNamenData usan un solo valor de kontaktNamenData que activó este efecto. Luego, está configurando la variable de estado en un nuevo valor cada vez, por lo que el segundo setKontaktNamenData está sobrescribiendo el primero. Sería mejor mapear sus valores primero y luego establecer la variable de estado con toda la matriz mapeada. Tampoco necesita configurarlo primero en una matriz vacía, y esto, de hecho, confundirá otras partes de su componente que dependen de kontaktNamenData . El estado actual de su efecto requeriría que kontaktNamenData sea una dependencia, pero no desea tener una dependencia de un valor que se establezca desde dentro del efecto, ya que activará un bucle infinito.
React.useEffect(() => { if (bearbeiten) { handleClickUserList(bearbeiten.user); setBeschreibung(bearbeiten.beschreibung); var ids = bearbeiten.freunde?.map((freund) => freund.id); setKontaktNamenData(ids); } }, [bearbeiten]);Si alguna vez realmente necesita el valor anterior de una variable de estado, use la devolución de llamada al establecer el nuevo valor en lugar de llamar explícitamente al nombre:
setKontaktNamenData(previousValue => previousValue.concat(newValue))¿Es esto lo que estás pidiendo?
React.useEffect(() => { if (bearbeiten) { handleClickUserList(bearbeiten.user); setKontaktNamenData(o => [...o, ..._.pluck(bearbeiten.freunde, 'id')]); } }, [bearbeiten]);He eliminado algunas líneas porque, según yo, no tenían sentido. ejemplo
// Setting this doesnt make sense because just after it you have written following. setKontaktNamenData([]); ... -> setKontaktNamenData([...kontaktNamenData, freund.id]);He actualizado su código de acuerdo con la mejor comprensión de lo que está preguntando. con dos cosas en cuenta. 1. Render de baja resolución y 2. SECO + Limpiar