Question

我有一个函数，可以准备来自后端的错误以使其易于在组件中显示-名为prepareErrorMessages。它接受来自后端的响应和一些默认错误消息。

所以-在传奇中，我有这个：

function* updateSomethingFlow(action) {
  try {
    const response = yield call(updateSomething, action.payload);
    if (response) {
      yield put({
        type: UPDATE_SUCCESS
      });
    }
  } catch (err) {    
    yield put({
      type: UPDATE_FAILURE,
      payload: prepareErrorMessages(err, 'Failed to update. Please, try again.')
    });
  }
}

所以-我在这里从后端修改错误吗？

还是在减速器中执行此操作更好？

case UPDATE_FAILURE:
  nextState = {
    ...state,
    loading: false,
    errors: prepareErrorMessages(payload, 'Failed to update. Please, try again.'),
  };
break;

还有-为什么在那里最好进行更新？

Answer 1

我个人比较喜欢将它放在传奇中，因为我认为这是处理这种逻辑的正确位置。

我希望我的reducer只负责更改状态，而不负责数据转换。

但这是我个人的看法。

Answer 2

我个人认为，在减速器中这样做是正确的。

您可以在其中处理响应。动作创建者应该只设置可能是静态数据或承诺的有效载荷。

看不到为什么不能在那里转换/修改接收到的数据。

Answer 3

我们正在使用一个Transformer来转换从Api获得的响应。变压器是获取输入并提供所需输出的功能。设计变压器可以使代码整洁并易于测试。
例如：-

function* updateSomethingFlow(action) {
  try {
    const response = yield call(updateSomething, action.payload);
    // after getting the response from the api pass through the transformer.
    const transformedResponse =apiTransformer(action.payload);
    if (response) {
      yield put({
        type: UPDATE_SUCCESS,
        data: trasnformedResponse
      });
    }
  } catch (error) {    
    yield put({
      type: UPDATE_FAILURE,
      error: error)
    });
  }
}

const apiTransformer = function(apiResponse) {
   // implement the logic. This function returns the transformed Response

 }

使用此功能，可以使减速器不受错误的影响。使代码可测试并使模拟变得容易。

对于全局后端错误，使用Redux中间件创建一个全局errorHandler，就像这样

const errorTracking = store => next => action => {
  if (/_FAILURE$/.test(action.type)) {
    const errorCode = parseInt(
      _.get(action, ['error', 'response', 'status'])
    )
    // this was for my use case
    if (errorCode === 403) {
     // launch an Global error handler action
      return next(ErrorHandlerAction())
    } else return next(action)
  }
  return next(action)
}

虽然不是一般性错误，但是您可以实现HOC将其包装在组件周围以进行可视化。因此，您可以对这些错误进行全局实现。

用redux-saga修改后端响应的最佳位置在哪里？

3 个答案: