Estoy creando un rastreador simple que tiene un control de estado si el botón es falso (no marcado) o verdadero (marcado).
La estructura de mis datos es algo como esto:
const [test, setTest] = useState([ { character: 1, two: [ { name: "one", id: 1, check: false }, { name: "two", id: 2, check: true }, ], }, { character: 2, two: [ { name: "one", id: 1, check: true }, { name: "two", id: 2, check: false }, ], }, ])Intenté crear una función que restableciera todos los valores de verificación a falso.
El usuario puede eliminar un carácter o agregar más, por lo que debo restablecer todas las comprobaciones de caracteres al mismo tiempo. Logré hacer esto, pero no estoy seguro de si el método que usé es aceptable o no.
La única forma en que podría resolver esto es crear una variable que tenga el valor de mi estado de prueba y luego hacer cambios en la matriz y al final; establecer mi estado de prueba para igualar la matriz.
let array = test array.forEach((arr, index) => { array = ([ ...array.slice(0, index), { character: arr.character, two: [ { name: "one", id: 1, check: false }, { name: "two", id: 2, check: false }, ], }, ...array.slice(index + 1) ]) }) setTest(array)Pasé un tiempo tratando de hacer que esto funcionara usando solo el estado de prueba, pero siempre me encontré con el mismo problema de que solo restablecería las dos comprobaciones del último carácter de la matriz.
Si alguien pudiera ayudarme a comprender esto mejor y si hay una manera de escribir esto sin tener que usar una variable (matriz), sería genial, gracias.
editar: olvidé incluir que las dos matrices a veces tendrán más o menos objetos en la matriz, por lo que tendría que cambiar todos sus valores. ejemplo:
[{ character: 1, two: [ { name: "one", id: 1, check: false }, { name: "two", id: 2, check: true }, ], }, { character: 2, two: [ { name: "one", id: 1, check: true }, { name: "two", id: 2, check: false }, { name: "three", id: 3, check: false }, { name: "four", id: 4, check: true }, ], },]
Podría usar Array.map , que devolverá una nueva matriz con valores de reinicio.
const resetTest= test.map((arr, index) => { return { character: arr.character, two: [ { name: "one", id: 1, check: false }, { name: "two", id: 2, check: false }, ], }; }); // You may need to use this syntax to set the array... setTest((testValues) => [...testValues, ...resetTest]);Simplemente use el método de envío de actualización de estado setTest y mapee todas sus entradas de matriz de estado anteriores para devolver una nueva matriz que contendrá el objeto actualizado, donde tendrán todas las propiedades distribuidas desde el objeto anterior y la propiedad dos también se asignará nueva matriz con objetos actualizados inmutablemente (marque establecido en falso).
const resetToFalse = () => { setTest(prevState => prevState.map(entry => ({ ...entry, two: entry.two.map(obj => ({ ...obj, check: false })) } ))); }