Question

我有一个可在渲染中获取一些用户信息的应用程序。因此，当应用程序首次启动时，它会使用getUserInformation（）函数来获取数据。用户无需手动登录，该应用程序位于公司内部网络内部。

export function getUserInformation() {
  return function (dispatch) {
    getUser()
      .then((data) => {
        dispatch(
          {type: GET_USER_SUCCESS, response: data}
        )
      })
      .catch((error) => {
        dispatch(
          {type: GET_USER_FAILURE, response: error}
        )
      })
  }
}

现在，我想获取应用程序的版本以在整个应用程序中使用。但是仅在用户登录后才能触发API调用（因此，成功调用了getUser（））。我应该添加

.then(getVersion())

在getUserInformation（）操作中？看起来不太干净，但我不知道该如何处理。

Answer 1

动作创建者是按顺序分派动作的适当位置。文档covers this：

使用像Redux Thunk这样的异步中间件肯定可以实现以下场景：连续分派多个不同但相关的动作，分派表示AJAX请求进度的动作，基于状态有条件地分派动作，甚至分派一个动作并检查此后立即更新状态。

如果需要分别测试用户信息和版本操作（它们应位于不同的模块中）或单独使用，则可以将操作创建者组合在一起。这需要返回承诺以将它们链接起来。这也显示了redux-thunk的局限性：

function getUserInformation() {
  return async (dispatch) => {
    try {
        dispatch(
          {type: GET_USER_SUCCESS, response: await getUser()}
        )
    } catch (error) {
        dispatch(
          {type: GET_USER_FAILURE, response: error}
        )
    }
  };
}

...

function getVersion() {
  return async (dispatch) => {...};
}

...

function getInitialData() {
  return async (dispatch, getState) => {
    await getUserInformation()(dispatch);
    // we need to use getState to check if there was an error
    // because getUserInformation returns a fulfilled promise any way
    await getVersion()(dispatch);
  };
}

重新抛出getUserInformation中的错误是有道理的，但是如果它与getInitialData分开使用，那将是不好的，因为这将导致未处理的拒绝。检查getState()是否存在错误的方法更加糟糕。

此方案需要比dead simple的redux-thunk更复杂的中间件-可能是基于该中间件并能够处理拒绝的定制中间件。

渲染时按顺序乱打

1 个答案: