Tengo un componente secundario que tiene algunos estados que cambian de valor cuando marca o desmarca algunas casillas; Quiero poder pasar esos valores de estado al componente principal. He intentado algunas cosas en Internet, pero nada parece funcionar.

He intentado (archivo de componente principal):

 const ParentComponent = () => { const [ data, setData ] = useState(); const childToParent = (childData) => { setData(childData); }; return( <Child childToParent={childToParent} /> ); }

y en el Componente Niño:

 const ChildComponent = ({ childToParent }) => { const [ childData, setChildData ] = useState(false); const handleChange = () => { setChildData(!childData); childToParent(childData); }; return( <div> <Checkbox value={childData} callback{() => handleChange()} /> </div> ); }

Básicamente, el problema es que no entiendo cómo mover datos de un componente secundario a un componente principal.