Question

大家好，我对编程非常陌生，试图通过redux和await / async函数来了解一件事。基本上我有这个功能：

 //nh functions
    const onSubmit = async data => {
        try{
            await dispatch(Login(data))
            if (auth.logged != false){
                addToast(content, { appearance: 'success', autoDismiss: true, })
                history.push('/')
            } else if (auth.logged == false){
                addToast(content2, { appearance: 'error', autoDismiss: true, })
            }
        }finally{
            console.log('Tada')
        }
    }

，它应该首先对帐户进行身份验证，然后推送通知。但是，等待根本不起作用，它会立即进入if语句。有提示吗？

Answer 1

戴夫说的是真的。如果您想做类似的事情，您应该分派数据并获得道具的结果。然后，您可以使用useEffect收听此道具并做您的事情。像这样：

useEffect(() => {
  // Do your things after your dispatch here
}, [yourProp]);

Answer 2

“正常”模式是编写异步伪动作：分派经典同步动作的异步函数：

my_task.apply_async(args=(param1, param2), countdown=60)

然后在组件中：

my_task.apply_async(kwargs={'param1':param1, 'param2':param2}, countdown=60)

您将需要使用异步中间件，例如https://github.com/reduxjs/redux-thunk

请参阅：

Answer 3

我假设auth是一个从redux状态映射到组件的道具？

如果是这样，当使用商店中的新值更新组件时，您就可以不必为提交按钮创建异步功能并处理重定向和/或状态更改。

我建议您这样做，因为您应该处理操作本身中的任何错误，这样可以使组件保持简单并主要关注显示的内容。

useEffect(() => {
  if (auth.logged != false){
      addToast(content, { appearance: 'success', autoDismiss: true, })
      history.push('/')
   } 
   else if (auth.logged == false){
      addToast(content2, { appearance: 'error', autoDismiss: true, })
   }
}, [auth.logged]);

const onSubmit = data => dispatch(Login(data))

异步/等待与redux反应

3 个答案: