Estoy intentando cambiar el valor de un campo de objeto que está anidado en una matriz. Sigo recibiendo este error: "No se puede asignar a la propiedad de solo lectura '0' del objeto '[matriz de objetos]'"
Así es como se ve el estado
{ "school stuffs": [ { "_id": "629332e33f0e48af3d626645", "completed": false, }, { "_id": "629425fc9c50b142dff947a9", "completed": true, } ], "household and furniture": [ { "_id": "629334424709234a344c0189", "completed": false, }, { "_id": "629334f12da7859af0828c9a", "completed": false, } ] }Aquí está el código que estoy usando para mutar el estado y cambiar el valor de "completado" al valor opuesto del booleano actual.
const newArray = { ...productArray, [value]: {...productArray}[value] } const index = productArray[value].findIndex(index => index._id === innerElement._id) newArray[value][index].completed = !newArray[value][index].completed console.log(newArray[value][index].completed);Lo que pasa con react es que no debes mutar el estado, para eso existen useState, y métodos de funciones puras, como en el siguiente ejemplo: Imagina que tienes un carrito de compras.
const [cart, setCart] = useState([]);Y desea agregar un producto, podría hacerlo de esta manera:
const addCart = product => { setCart([...cart, product]) // Using spread syntax. setCart(cart.concat(product)) // Using pure functions. }Si desea mutar un accesorio en un objeto dentro de un estado, esta es la forma en que podría hacerlo:
const increaseQuantity = id => { const mappedCart = cart.map(prd => prd.id === id ? {...prd, quantity: prd.quantity + 1} : prd); setCart(mappedCart) }Por supuesto, puede usar bucles for simples u otras formas, pero el problema aquí es que no puede mutar el estado en reaccionar.
espero haberte podido ayudar