Estoy recibiendo este error:
Se superó la profundidad máxima de actualización. Esto puede suceder cuando un componente llama a setState dentro de useEffect, pero useEffect no tiene una matriz de dependencias o una de las dependencias cambia en cada procesamiento.
tengo este estado:
const [arrayOfDocuments, setArrayOfDocuments] = useState([]);
que almacenan objetos de tipo documento
Función que agrega los documentos al estado:
const pushToArrayOfDocuments = (obj) => { if (obj.filename && obj.file && obj.expiredate && obj.doctype) { setArrayOfDocuments((oldArr) => { const arr = oldArr.slice(); const index = arr.map((e) => e.filename).indexOf(obj.filename); if (index !== -1) { arr[index] = obj; } else { arr.push(obj); } return arr; }); } };
Ahora esta función se pasa a los subcomponentes:
como esto :
<OperatorDocument key={`Visura camerale${count}`} title="Visura camerale" setDocument={pushToArrayOfDocuments} description=" in dolor." document={getObjectByName('Visura camerale')} filedocname="Visura camerale" />
Ahora dentro del subcomponente tengo este estado:
const [file, setFile] = useState(document);
Ahora, si este estado cambia, llamo a setDocument dentro de useEffect
useEffect(() => { setDocument(file); }, [file, setDocument]);
y ahora me sale el error. ¿Alguna idea sobre cómo puedo prevenir esto?
El error ya le indicó el problema porque setState está en la dependencia de la matriz, el componente se actualiza cada vez.
Intente esto Elimine el setDocument y deje solo el archivo en la matriz de dependencia de esa manera se actualiza solo cuando cambia el archivo
Me gusta este [archivo]