reactjs - react /Redux : Where to process data from API response and dispatching action from reducers

Question

我是 React 和 Redux 的新手，所以这在某种程度上是一个最佳实践问题。

我有一个操作创建器，可以触发 API 调用并将响应分派(dispatch)给我的 reducer :

export function loadDrawSuccess(draw) {
  return { type: ActionTypes.LOAD_DRAW_SUCCESS, draw};
}

export function loadDraw() {
  return function(dispatch) {
    dispatch(beginAjaxCall());
    return drawApi.getDraw().then(draw => {
      dispatch(loadDrawSuccess(draw));
    }).catch(() => {
      dispatch(ajaxCallError());
    });
  };
}

现在......在我的 reducer 中，我正在处理响应以从中提取我需要的数据......

function extractNextOpenDraw(draws) {
  if (!draws || typeof draws.content === 'undefined'){
    return {};
  }
  let openDraws = draws.content.filter(draw => {return draw.status === 'open';});
  let sortedOpenDraws = openDraws.sort((draw1, draw2) => {
    return DateHelper.getDateObjectFromUtcDateString(draw1.closeTimeUtc) - DateHelper.getDateObjectFromUtcDateString(draw2.closeTimeUtc);
  });
  return sortedOpenDraws[0];
}


export default function drawReducer(state = initialState.draw, action) {

  switch (action.type) {
    case types.LOAD_DRAW_SUCCESS: {
      return objectAssign({}, extractNextOpenDraw(action.draw), {dateModified: action.dateModified});
    }
    ........

    default:
      return state;
  }
}

我的问题是

1. 我在 reducer 中处理响应是否正确，还是应该在 API 类或操作创建器中处理？
2. 在 API 返回且没有错误的情况下，但响应格式不符合预期格式，我希望分派(dispatch) ajaxCallError() 操作。在 reducer 中执行此操作是否正确？

Answer 1

1. 不，reducer 应该尽可能干净，并且仅使用提供给它的值来更新存储。您应该解析操作本身的响应，或者为 api 创建一个包装器。我相信，在行动本身中这样做就足够了。
2. 不，处理操作中的所有此类错误并将其分派(dispatch)到那里。 reducer 不能也不应该调度操作。