react-toastify显示在我点击之前

Question

我已经制作了notify函数，它接受参数

const notify = (error) => {
toast.error(error)
}

和dom作为

<button onClick={notify(error)}>Submit</button>

其中error是我的useState钩子，如果从redux rtk中获取某些内容，则设置该钩子。我设置了setError，它通过useEffect钩子监听，如下所示

const [loginUser, {data, isError, emessage}] = useLoginUserMutation();
const [error, setError] = useState('')
useEffect(() => {
if(isError){
setError(emessage.data.errors)
}
},[isError, data, emessage])

我试过这样写

useEffect(() => {
if(isError){
toast(emessage.data.errors)
}
})

，幸运的是，它只在第二次工作，奇怪的是，在第一个错误消息中显示空白的弹出框，在两个弹出框中同时出现，然后停止。

我做错了什么吗?谢谢你的帮助。

Answer 1

你需要将它作为回调传入，而不是在渲染时直接执行:

<button onClick={() => notify(error)}>Submit</button>