如何确保所有使用redux的promise中的promise顺序正确？

Question

我正在使用 redux（并做出反应），我必须多次发出多个 api 请求。我正在使用 for 循环并承诺所有。正在解决的订单承诺是问题，因为订单是随机的 - 首先第二个承诺得到解决，然后是第一个，然后是第三个而不是 1,2,3。 我做错了什么还是如何更改订单？另外，当我没有收到任何数据时，停止迭代的方法是什么？我将不得不迭代大约 25 次，但不想对其进行硬编码。我可以用我的渔获来确定吗？非常感谢！

行动：

export const fetchData = () => {
    return dispatch => {
        const promises = [];

        dispatch({type: FETCHING_DATA})

        for (var i = 0; i < 3; i++) {
            const start = i === 0 ? 0 : (i + "01");
            let getData = axios.get(`${api_root_url}/v1/?start=${start}`)    
                .then(res => {
                    dispatch({type: FETCH_DATA_SUCESS, payload: res.data})
                })
                .catch(err => {
                    dispatch({type: FETCH_DATA_ERR, payload: err.data})
                })
            promises.push(getData)
        }
        return Promise.all(promises)    
    }
}

Answer 1

如果在解决 3 个请求时分派的操作顺序很重要，您可以尝试 2 件事：

在所有 3 个操作都完成后发送操作：

export const fetchData = () => {
    return dispatch => {
        const promises = [];

        dispatch({type: FETCHING_DATA});
        Promise.all(
          [...new Array(3)].map((ignore,i)=>i === 0 ? 0 : (i + "01"))
          .map(
            start=>axios.get(`${api_root_url}/v1/?start=${start}`)
          )  
        ).then(
          results=>results.forEach(
            result=>
              dispatch({type: FETCH_DATA_SUCESS, payload: result.data})
            )
        ).catch(
          err => dispatch({type: FETCH_DATA_ERR, payload: err.data})
        );
        //not sure why you want to return something here
        //return Promise.all(promises)    
    }
}

或者保持你的代码原样，但是在dispatch({type: FETCH_DATA_SUCESS, payload: result.data})添加什么请求已经完成，这样reducer就知道在哪里更新状态。 dispatch({type: FETCH_DATA_SUCESS, payload: {request_from:start,data:res.data}}) 之类的东西，catch 语句也一样。