我的 Redux 处理来自 axios 的错误应该使用不同的操作还是附加附加数据的相同操作？

Question

我正在使用带有 redux 的 Axios 和 Thunk 中间件调用 api 来获取事务列表。 API returns 的任何错误也会返回一个错误对象。该错误对象的格式为

{
  "error": {
    "id": "string",
    "name": "string",
    "detail": "string"
  }
}

如果我收到 400，这是一些一般性错误，但 404 表示未找到交易。我想知道的是逻辑应该在哪里解析响应？我是否应该在动作创建者中解析响应，并发送单独的动作，看起来像这样：

catch (e) {
  if (e.response) {
    if (e.response.status === 400) {
      //failed for some reason
      dispatch({type: TRANSACTION_REQUEST_ERROR, data: e.response.data})
    }
    if(e.response.status === 404) {
      //no transactions, no problem. 
      dispatch({type: NO_TRANSACTIONS_FOUND, data: e.response.data})
    }
  }
}

或者，我是否应该使用相同的操作并包含 reducer 决定如何更新状态所需的任何响应信息，并将该逻辑委托给 reducer？

catch (e) {
  if (e.response) {
    dispatch({type: TRANSACTION_REQUEST_ERROR, data: e.response.data})
  }
}

//减速机

switch(action.type) {
  case TRANSACTION_REQUEST_ERROR:
   if(action.data.error.id === 'some id)
    //update some state
   else
     //do something else
}

或者，是一个中的六个，另一个中的六个？

Answer 1

我只会对减速器中的错误和处理情况使用一种操作。这确保应用程序中的每个请求都是同构的，并且只有 3 个操作 _REQUEST、_SUCCESS、_ERROR。而且更容易与 redux-requests 或其他中间件集成。

我的 Redux 处理来自 axios 的错误应该使用不同的操作还是附加附加数据的相同操作？

Should my Redux handling of errors from axios use different actions or the same action with additional data attached?

reactjs

redux

redux-thunk

react-redux

axios