使用async / await处理Thunk Action中的Catch

时间:2017-07-18 17:20:58

标签: javascript reactjs redux react-redux redux-thunk

无法在此处弄清楚如何处理异常。

容器

  async handleResetPassword(uuid) {
        console.log("handleResetPassword invoked!")
        try {
          await this.props.resetUserPassword()
    ...rest of the code

Thunk Action

export function resetPasssord() {
  return async (dispatch, getState) => {
    const state = getState()

    try {
      const response = await UserApi.ResetUserPassword(state.auth.token)

      if(response && response.body){
        dispatch(UserActions.resetPasswordReceived)
      }

      dispatch(UserActions.resetPasswordFail)
    }
    catch(err) {
      //what do I do here?  How should I resolve this?
      dispatch(UserActions.resetPasswordFail)
    }
  }
}

还有如何处理相关API的问题。如上所示,thunk动作在这里调用Api:

UserApi (使用superagent):

const ResetUserPassword = async (token) => {
  try{
    return await request
      .post(`${endpoint}/users/recover-password`)
      .set({ Authorization: `Bearer ${token}` })
      .accept('application/json')
  }
  catch(err) {
    console.log(err)
    //how handle this?
  }
}

在集思广益时,我的想法是:

  • 需要从catch中的API调用返回某种承诺,以便await可以在thunk action中解决
  • 需要从catch中的thunk动作返回某种承诺,以便容器可以解决拒绝
  • 我是否在try-catch中发送错误操作?

但是我不确定我是否在正确的道路上或在上面的每个捕获中编码什么。

0 个答案:

没有答案