Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

142
Vistas
Adición y eliminación de objetos en el estado de un componente

Tengo una lista de entradas de verificación, y cuando se seleccionan y deseleccionan, intento agregarlas/eliminarlas del estado. Pero he notado que cuando anulo la selección de uno, el que seleccioné antes es el objeto eliminado del estado. Creo que esto se debe a que cuando se llama a la función onChange, el estado no se ha actualizado (aunque la interfaz de usuario sí lo ha hecho), pero no entiendo cómo tener una lista completa de todas las comprobaciones seleccionadas con el estado retrasado en un valor. Aquí está mi entrada y la función onChange:

 const [selected, setSelected] = useState([]); const handleSelect = (e) => !!DATA && DATA.forEach((item, idx) => { let name = e.target.name; if (item.payerName === name && !selected.includes(item)) { setSelected([...selected, item]); return; } else if (item.payerName === name && selected.includes(item)) { // index varies let index = selected.indexOf(item); let clean = selected.splice(index, 1); setSelected(clean); } }); DATA.map((item, idx) => { return( <input name={item.payerName} type="checkbox" checked={selected.includes(item)} onChange={handleSelect} className="insurance-checkbox m-2 mt-3" /> ) }
about 4 years ago · Santiago Gelvez
1 Respuestas
Responde la pregunta

0

Prueba esto:

 const [selected, setSelected] = useState([]); const handleSelect = (e) => { const { name } = e.target; const item = DATA.find(({ payerName }) => payerName === name); if (selected.includes(item)) { setSelected(selected.filter((s) => s === item); } else { setSelected([...selected, item]); } }

o mejor:

 const handleSelect = (e) => { const { name, checked } = e.target; const item = DATA.find(({ payerName }) => payerName === name); if (checked) { if (!selected.includes(item)) { // probably not needed setSelected([...selected, item]); } } else { setSelected(selected.filter((s) => s === item); } }
about 4 years ago · Santiago Gelvez Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda