在所有内部承诺解决之前解决了Promise，多个异步API调用

Question

您好我是react / redux开发环境的新手，所以我感谢您的帮助。

我试图通过在我的app.js中调用componentDidMount dispatch(fetchAllPositions(selectedUserDivision))异步进行2次API调用

我在this post中找到了建议的方法，fetchAllPositions函数在Promise.all

中将两个动作函数包装在一起

export function fetchAllPositions(division) {
  return dispatch => Promise.all([
        dispatch(fetchUserPositionsIfNeeded(division)),
        dispatch(fetchDefaultPositionsIfNeeded(division))
    ])
    .then(console.log("fetched both"))
}

两个动作函数几乎完全相同，它们只是调用稍微不同的API URL。其中一个看起来如下，其中shouldFetchUserPosition只是一个返回布尔值的纯函数：

function fetchUserPositions(division) {
  return dispatch => {
      const url = apiOptions.server + `/api/user/position?division=${division}`
      dispatch(requestUserPositions(division))
    return fetch(url, options)
      .then(response => response.json())
      .then(json => dispatch(receiveUserPositions(division,json)),
        err => console.log(err))

  }
}

export function fetchUserPositionsIfNeeded(division) {
  return (dispatch, getState) => {
    if (shouldFetchUserPositions(getState(), division)) {
      return dispatch(fetchUserPositions(division))
    } else {
      return Promise.resolve()
    }
  }
}

逻辑是，对于更新，在提取数据时发送REQUEST...操作，然后在数据准备好更新到新状态时发送RECEIVE...操作。

问题是Promise.all在REQUEST1之前应该等REQUEST2 RECEIVE1 RECEIVE2 .then(console.log("fetched both"))进来p>

现在，在{2} .then之后REQUEST完成，而不是等待2 RECEIVE进来。

我怀疑它包含requestUserPositions()

的函数中fetch()的嵌套特性

REQUEST操作是一个简单的功能，在reducer中它只是将isFetching属性翻转为true：

function requestUserPositions(division) {
  return {
    type: REQUEST_USER_POSITIONS,
    division
  }
}

对于这个长期问题感到抱歉，但我很感激任何建议。

Answer 1

这是一个粗心的错误

事实证明，当.then()被包装在一个调度中时，它会在Promise.all()被执行时同时执行。

通过将then(()=>console.log标记为从dispatch(fetchAllPositions(selectedUserDivision))

完成的上次调度ComponentDidMount来创建预定的调度订单