Estoy tratando de crear una matriz duplicada para poder editar los valores y restablecerla también, esto es lo que obtuve:
const handleInput: any = (index: any, property: any, value: any) => { const newCertificates = [...props.resume.certifications]; newCertificates[index][property] = value; props.setResume({ ...props.resume, certifications: newCertificates }) }Pero me sale este error:
Certificates.tsx:18 Uncaught TypeError: Cannot assign to read only property 'certificationName' of object '#<Object>'Está intentando modificar su estado directamente, ya que los objetos dentro de newCertificates siguen siendo los mismos objetos a los que se referían en su estado original. Usar [...] solo crea una copia superficial de su matriz, por lo que los objetos dentro no se clonan (consulte aquí para obtener más detalles). En React, no debe modificar el estado directamente, ya que eso puede generar problemas con el renderizado, y eso es lo que TS intenta decirle con el error.
En lugar de modificar estos objetos, use .map() en props.resume.certifications y luego devuelva un nuevo objeto una vez que encuentre el objeto que necesita modificar y devuelva un nuevo objeto con el valor actualizado:
props.setResume(resume => ({ ...resume, certifications: resume.certifications.map((obj, i) => i === index ? {...obj, [property]: value} : obj ) }));De esta manera, solo está leyendo y nunca escribiendo a su valor de estado.