React “pass back” 回调（作为状态？

问：

我有两个react组件：Filter和UseFilter（以及一个Parent）。Filter 显示多个筛选选项，并生成一个回调，该回调可以根据设置的选项筛选项目。如何传回回调并将其作为状态存储在父级中？

function Parent() {
    const [cb, setCb] = useState(defaultCb);

    return (
        <>
            <Filter onChange={setCb}></Filter>
            <UseFilter filter={cb}></UseFilter>
        </>
    );
}

function Filter({ onChange }) {
    const [checkboxState, setCheckboxState] = useState(false);

    useEffect(() => {
        onChange((item) => {
            return item.boolProp == checkboxState;
        });
    }, [checkboxState]);

    return <input type="checkbox" onChange={(e) => setCheckboxState(e.target.checked)} />;
}

喜欢这个？

我不确定这个代码片段是否正确。你能把回调保存为状态吗？在这种情况下，我将如何使用useCallback？