Hola chicos, estoy atascado con un problema estúpido en el que tengo mi componente de casilla de verificación que establece el estado de la casilla de verificación pero no lo lee y no puedo averiguar cómo hacerlo. Estoy usando las casillas de verificación en un modal y actualmente, cuando el modal está cerrado, el estado de las casillas de verificación no se guarda. Así que aquí está el componente:
import { useState } from 'react'; import { handleToggle } from '../../utils'; const Checkboxes = ({ list, handleFilters }) => { const [checkedArray, setCheckedArray] = useState([]); const onChangeHandler = (checkboxId) => { const newState = handleToggle(checkboxId, checkedArray); setCheckedArray(newState); handleFilters(newState.map((id) => list[id].value)); }; return list.map((item, index) => { return ( <div key={index}> <input type="checkbox" id={item.name} checked={checkedArray.indexOf(item.id) !== -1} onChange={() => onChangeHandler(item.id)} /> <label htmlFor={item.name}>{item.label}</label> </div> ); }); }; export default Checkboxes;Y en mi aplicación:
const handleFilters = (checkboxState, key) => { const logic = 'AND'; const newFilters = { ...selected }; newFilters[key] = checkboxState;¡Que tengas un buen lunes!