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

【问题标题】：How to fix error "argument of type (open: any) => boolean is not assignable to parameter of type boolean" using react and typescript?如何使用反应和打字稿修复错误“类型参数（打开：任何）=>布尔值不能分配给布尔类型的参数”？
【发布时间】：2020-09-10 03:39:53
【问题描述】：

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

我有一个方法 toggleDialogVisibility 定义如下

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

我在下面的其他组件中调用它，

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

我不知道如何在这里传递什么类型。有人可以帮我解决这个问题。谢谢。

【问题讨论】：

将Parent函数中的open => !open改为!open。
抱歉打错了，把函数toggleDialogVisibility改成(toggleValue: (currentValue: boolean) => boolean)，其余保持原样。

标签： reactjs typescript

【解决方案1】：

参数函数toggleDialogVisibility的类型是布尔值。您应该发送一个布尔值而不是一个回调函数。

() => toggleDialogVisibility(!open)}

【讨论】：

【解决方案2】：

在父组件中发送切换值，而不仅仅是为我解决它的函数：

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

在子组件中：

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

【讨论】：