Tengo el siguiente problema: tengo un método que devuelve una matriz multidimensional en mi componente Grids. Me gustaría almacenar cualquier matriz multidimensional recalculada en una lista separada. El problema es que cuando uso mi useState() declarado de esta manera
const [listGrid,setListGrid] = useState<any[]>([])solo el elemento de estado actual se guarda repetidamente en la lista de arreglos. Siga el código de la parte de interés:
const [listGrid,setListGrid] = useState<any[]>([]); const grid= initGrid(); //initialise a new grid. const disableButtonHandler = ():void => { const cloneGrid =[...grid] console.log(cloneGrid===grid)//are no the same!! setListGrid(prevListGrid=>[...prevListGrid,cloneGrid]); };esta es la instantánea de mi lista con las cuadrículas guardadas:
entonces, básicamente, todas las matrices almacenadas en listGrid son iguales y me gustaría almacenar cualquier cambio de mi lista calculada.
¿Qué podría hacer mal con eso? gracias de antemano.
La matriz está representada por una matriz de matrices, mientras duplica la matriz contenedora, las contenidas siguen siendo las mismas. Básicamente, cloneGrid[i] === grid[i] es verdadero para 0 <= i < grid.length .
Puedes solucionar esto haciendo lo siguiente:
const cloneGrid = grid.map(row => [...row]);