使用 redux-thunk 處理錯誤，本機反應

Question

我正在使用 redux-thunk 在我的本機應用程序中使用 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

看起來您沒有傳遞回調方法來處理錯誤。 嘗試這個：

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

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

props.doLogin(data, onSuccess, onError)

Answer 2

我用另一種方式找到了解決方案，我必須在我的前端應用程序部分編寫兩個回調，例如，

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")
 })