Necesito enviar los datos en forma de matriz, desde el valor de la casilla de verificación.
Código
import React,{ useState,useEffect } from "react"; export default function App() { const [person, setPerson] = useState([]); const CheckHandler = () => { // setPerson(() => { ...person, }) } useEffect(() => { //Print data each time the checkbox is "checked" or "unchecked" console.log(person); }, [person]); return ( <> <input type="checkbox" id="jane" name="jane" value="jane" onClick={() => CheckHandler()} /> <label htmlFor="jane">jane</label><br/> <input type="checkbox" id="Mike" name="Mike" value="Mike" onClick={() => CheckHandler()} /> <label htmlFor="Mike">Mike</label><br/> <input type="checkbox" id="board" name="board" value="board" onClick={() => CheckHandler()} /> <label htmlFor="board">board</label><br/> </> ); }¿Qué debo hacer para obtener mis datos en una matriz en mi consola?
caja de arena: https://codesandbox.io/s/adoring-rgb-27wkt
¿Quieres así y también agregué agregar y quitar filtro?
const CheckHandler = (e) => { const value = e.target.value; setPerson((prev) => person.includes(value) ? prev.filter((cur) => cur !== value) : [...prev, e.target.value] ); };CÓDIGO COMPLETO
import React, { Fragment, useState, useEffect } from "react"; export default function App() { const [person, setPerson] = useState([]); const CheckHandler = (e) => { setPerson((prev) => [...prev, e.target.value]); }; useEffect(() => { //Print data each time the checkbox is "checked" or "unchecked" console.log(person); }, [person]); return ( <Fragment> <input type="checkbox" id="jane" name="jane" value="jane" onClick={CheckHandler} /> <label htmlFor="jane">jane</label> <br /> <input type="checkbox" id="Mike" name="Mike" value="Mike" onClick={CheckHandler} /> <label htmlFor="Mike">Mike</label> <br /> <input type="checkbox" id="board" name="board" value="board" onClick={CheckHandler} /> <label htmlFor="board">board</label> <br /> </Fragment> ); }Códigos y caja: https://codesandbox.io/s/twilight-hill-lh9bv?file=/src/App.js:0-986