React Native 异步等待调度存储答案

【问题标题】：React Native async await dispatch storeReact Native 异步等待调度存储
【发布时间】：2021-06-16 12:42:42
【问题描述】：

所以我想做一个登录功能，在这里服务器将首先验证用户名或密码是否正确。我正在使用 store，react - redux。

这是我按下登录按钮时的代码

const [statusLogin,setStatusLogin] = useState(null)
let loginInfo = []

function loginButton(){
    (async () => {
            loginInfo = {username:username,password:password}
            const { status } = await dispatch(getUser(loginInfo))
            if (status==1){
                console.log(status,'in status if 1')
                setStatusLogin('granted')
            }else{
                console.log(status,'in status if else')
                setStatusLogin(null)
            }
    })();
}

这是我的商店，假设返回值 1 或其他如果它返回值 1 geb statusLogin 将更改为授予

export function getUser(body){
    return dispatch =>{
        if (!body){
            setTimeout(() => {
                console.log('no username/pass')
            }, 2000);
        }else{
            setTimeout(() => {
                console.log('username/pass validated returning with value 1')
            }, 2000);
        }
    }
}

请帮帮我

【问题讨论】：

标签： react-native asynchronous async-await react-redux react-hooks

【解决方案1】：

你可以像这样使用：

usEffect(( )=>{
if(statusLogin) getUser()
},[statusLogin])

还有一点，你的函数不应该传入回调。你可以使用dispatch来修改reducer，而不是使用回调来改变状态。

【讨论】：

一开始我有点用这个，但我认为回调更好，谢谢
现在使用回调可能很容易。但是当您来维护或修复错误时，这将是一场噩梦。传递回调将分离您的逻辑代码。所以最好不要使用回调作为参数

【解决方案2】：

这可能会有所帮助

...
function loginButton() {
  (async () => {
    loginInfo = { username: username, password: password };
    await dispatch(getUser(loginInfo, callback));
  })();
}

function callback = (status) => {
  if (status == 1) {
    console.log(status, "in status if 1");
    setStatusLogin("granted");
  } else {
    console.log(status, "in status if else");
    setStatusLogin(null);
  }
};

reducer.js

export function getUser(body, callback){
    return dispatch =>{
        if (!body){
            setTimeout(() => {
                console.log('no username/pass');
                callback(0);
            }, 2000);
        }else{
            setTimeout(() => {
                console.log('username/pass validated returning with value 1')
                callback(1);
            }, 2000);
        }
    }
}

【讨论】：

@Bzxnaga 如果有帮助，请接受答案谢谢:-)