使用 AND 逻辑运算符的条件渲染在 React 中总是返回 true

问题描述

我正在做一个项目，我想在 async-await 箭头函数中完成登录后关闭对话框，为此我在按钮中调用登录函数并等待返回（如果登录完成则为真）并使用逻辑运算符 && 关闭对话框，如果钩子 onClose 为真，但 onClose 无论如何都会被调用，无论是真还是假，我都花了一整天的时间尝试修复它，我做错了什么？提前感谢您的帮助。 ^^

登录箭头异步功能

 const login = async () => {
        let bool = false;
        await axios.post(url + '/login',{
            username: form.email,password: form.password
        })
        .then(function (response) {
            console.log(response.data);
            if (response.data === 202) {
                bool = !bool;
                console.log(bool);
            } else if (response.data === 404) {
                console.log(bool);
            }
        })
        .catch(function (error) {
            console.log(error);
        });
        return bool;
    }

按钮

<Button onClick={() => login() && onClose()} color="primary"> Login </Button>

我也试过三元运算符，结果相同

 <Button onClick={() => login() ? onClose() : null} color="primary"> Login </Button>

感谢@pilchard，正确的方法是

<Button onClick={async () => await login() && onClose()} color="primary">Login</Button>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）