如何使用react和typescript修复错误“类型参数（打开：任何）=>布尔值不能分配给布尔类型的参数”？

Question

i want to fix the error "argument of type (open: any) => boolean is not assignable to parameter of type boolean" using react and typescript

i have a method toggleDialogVisibility defined like below

export const useDialog() {
    const {setDialogVisibility} = React.useContext(DialogContext);
    return (
        const toggleDialogVisibility = (toggleValue: boolean) => {
            setDialogVisible(toggleValue);
        };
    );
}

and i am calling it in other component like below,

function Parent() {
    const {toggleDialogVisibility} = useDialog();
    return (
        <div onClick={() => toggleDialogVisibility(open => !open)} /> //getting error here
    );
}

i am not sure how to what type to be passed here. could someone help me with this. thanks.

Answer 1

The type of param function toggleDialogVisibility is boolean. You should send a boolean instead a callback function.

() => toggleDialogVisibility(!open)}

Answer 2

send the toggle value as well not just the function this solved it for me, in the parent component:

 const [toggle, setToggle] = useState<boolean>(false);
   <EditForm setToggle={setToggle} open={toggle}/>

in the child compnent:

interface Props{
    open: boolean,
    setToggle: (toggle: boolean) => void
  }
  setToggle(!open);