使用 redux-thunk 处理错误，反应原生

Question

我正在使用 redux-thunk 在我的 react-native 应用程序中使用 redux 设置。这是简单的登录操作

export const doLogin=(request, onSuccess, onError)=>{
return dispatch=>{
    console.log(request)
    axios.post(`/AppUser/LoginValidation`, request).then(res=>{
        console.log(res.data)
        if(res.data.isSuccess=== true){
            dispatch({
                type:LOGIN,
                payload:{
                     auth_token: res.data.authToken,
                     responseResult: res.data.responseResult,
                     loggedIn: true
                }
            })
            onSuccess && onSuccess();
        }else{
            dispatch({
                type: ERROR,
                payload: res.data.message
            })
            onError && onError();
        }
    })
    .catch(err=>{
        console.log('err',err )
    })
}

}

这样我就在前端使用了上面的代码：

 props.doLogin(data,()=>{
        action.setErrors({password: props.errorMsg})
        // action.resetForm();
        // setMobileno(null)
        props.navigation.navigate('FLayout', { screen:'Home' })
    })

如果登录 ID 和密码正确，它会重定向我。如果我输入了无效的 ID 和密码，它仍然会将我重定向到主页，而不是向我显示消息。

Answer 1

我以另一种方式找到了解决方案，我必须在我的前端应用部分中编写两个回调，例如，

props.doLogin(data,()=>{
    
    // action.resetForm();
    // setMobileno(null)
    props.navigation.navigate('FLayout', { screen:'Home' })
},
()=>{
    action.setErrors({password: props.errorMsg})
    console.log("another callback for error handle")
 })

Answer 2

看起来您没有传递回调方法来处理错误。试试这个：

const onSuccess = () => {
  props.navigation.navigate('FLayout', { screen:'Home' })
}

const onError = () => {
  action.setErrors({password: props.errorMsg})
  // action.resetForm();
  // setMobileno(null)
}

props.doLogin(data, onSuccess, onError)