Quiero modificar un objeto en una matriz llamando a array.find() y luego mutar la referencia devuelta para mutar indirectamente la matriz, pero eso no parece funcionar. Asumí al leer otros artículos que array.find() devuelve una referencia a un objeto en la matriz en una coincidencia exitosa, pero ese no parece ser el caso.
En este codesandbox , si cambio el resultado de array.find(), la matriz no se actualiza. Puedo actualizar la matriz si reemplazo array.find() con array.findIndex() y modifico los elementos de la matriz por índice, pero el código no está tan limpio y todavía no entiendo por qué no puedo actualizar por referencia.
¿Array.find() devuelve una referencia a un objeto en la matriz o una copia? En los códigos y la caja proporcionados, parece comportarse como si fuera una copia.
Cualquier consejo es apreciado.
Find solo encuentra el primer elemento en la matriz, no editan el elemento, pero encuentran el elemento. Entonces, cuando tiene el elemento, puede editarlo después, pero no tiene el índice del elemento dentro de la matriz, por lo que también necesitará el índice si desea pasar el elemento editado en la matriz.
Tienes varias formas de actualizar. Si quieres un camino más corto, en este momento me vino a la mente así:
setArray((oldState) => oldState.map((item) => { if (item.value === "one") { return { value: "asdasd" }; } return {...item}; }) ); Entonces, directamente puede establecer el valor dentro setArray , ¿por qué? porque el mapa devuelve una nueva matriz. O puedes escribir más legible:
const newState = array.map((item) => { if (item.value === "one") { return { value: "asdasd" }; } return {...item}; }); setArray(newState)Una pregunta similar se puede encontrar aquí
Si tiene alguna pregunta, pregunte. Gracias.