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

170
Vistas
Cómo agregar un campo a una matriz de objetos usando useState en reaccionar

Estoy creando una aplicación en React Native y quiero una forma en la que pueda agregar regularmente un campo a uno o todos los datos del usuario antes de enviarlo a la base de datos. Es una matriz de objetos y conozco el índice de cada uno. objeto. Soy consciente de la desestructuración de objetos, pero no sé cómo hacerlo. En el siguiente ejemplo, ¿cómo agrego el campo "hobby" y un valor de "Fútbol" solo a smith? Gracias por adelantado.

 const [usersData, setUsersData] = useState([ { name: "Jane", sex: "female", age: "20", }, { name: "Doe", sex: "male", age: "29", }, { name: "Smith", sex: "male", age: "24", }, ]); const addHobby = (index, hobby) => { //Adding the field here// };
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Aquí hay una manera de lograr esto:

 const addHobby = (index, hobby) => { let temp = [...usersData] // Create a copy with the spread operator temp[index].hobby = hobby // Set new field setUsersData(temp) // Save the copy to state } ... addHobby(2, "Football") // 2 being known index of "Smith"

Editar: según lo sugerido por @EmileBergeron, el operador de propagación crea solo una copia superficial, lo que significa que el estado original aún se modificará en caso de cambios en las propiedades del objeto. Un enfoque más fácil de reaccionar sería usar .map()

 const addHobby = (index, hobby) => { // Create a copy using .map() const temp = usersData.map((data, idx) => { let tempData = {...data} // Copy object if(idx === index) tempData.hobby = hobby // Set new field return tempData }) setUsersData(temp) // Save the copy to state }
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