如何使用react和typescript修复错误“不能将false类型的参数分配给currentValue:boolean=> boolean”的错误?

问题描述

我想修复错误“不能使用react和typescript将false类型的参数分配给(currentValue:boolean)=> boolean。

我有一个如下定义的方法toggleDialogVisibility

export const useDialog() {
    const {setDialogVisibility} = React.useContext(DialogContext);
    return ({
        const toggleDialogVisibility = (toggleValue: (currentValue: boolean) => boolean) => { //this is causing the error
            setDialogVisible(toggleValue);
        };
    } );
};

我在如下两个部分中称呼它,

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

function AnotherComponent() {
    const {toggleDialogVisibility} = useDialog();
    const handle = () => {
        toggleDialogVisibility(false);  //error here
    }
}

我不确定如何解决此问题。有人可以帮我吗谢谢。

解决方法

在此代码中:

return (
        const toggleDialogVisibility = (toggleValue: boolean) => {
            setDialogVisible(toggleValue);
        };
    );

您认为您正在返回具有函数的对象,但事实并非如此。

修复

例如返回一个函数

return ({ 
    toggleDialogVisibility: (toggleValue: boolean) => {
        setDialogVisible(toggleValue);
    };
});
,

我认为您不需要useDialog

function Parent() {
    const {setDialogVisibility} = React.useContext(DialogContext);
    return (
        <div onClick={() => setDialogVisibility(open => !open)} /> //getting error here
    );
}
function AnotherComponent() {
    const {setDialogVisibility} = React.useContext(DialogContext);
    const handle = () => {
        setDialogVisibility(false);  //error here
    }
}

如果真的想要,我更喜欢

export const useDialog() {
    const {setDialogVisibility} = React.useContext(DialogContext);
    return React.useCallback(()=> {
      setDialogVisibility(x=> !x)
    },[setDialogVisibility])
};

function Parent() {
    const toggle = useDialog();
    return (
        <div onClick={toggle} /> //getting error here
    );
}
function AnotherComponent() {
    const toggle = useDialog();
    return <div onClick={toggle}>Close</div>
}

相关问答

Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其...
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。...
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbc...