Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

340
Vistas
React useEffect toma solo el último elemento de la matriz de objetos

¿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: ingrese la descripción de la imagen aquí

Sin embargo, al guardar, solo se muestra o acepta el último elemento de la matriz de ganchos: ingrese la descripción de la imagen aquí

about 4 years ago · Juan Pablo Isaza
3 Respuestas
Responde la pregunta

0

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]);
about 4 years ago · Juan Pablo Isaza Denunciar

0

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))
about 4 years ago · Juan Pablo Isaza Denunciar

0

¿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

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda