如何等待多次Axios请求全部完成？

这个问题我之前做批量接口请求时也碰到过！你现在的写法里每个请求都是独立异步执行的，确实没法直接感知到所有请求什么时候全部结束，用Promise.all就能轻松解决这个问题，具体可以这么改：

方法一：用Promise.all等待所有请求成功完成 #

这种方式适合要求所有请求都必须成功的场景——只要有一个请求失败，就会直接进入错误捕获逻辑：

// 先创建一个数组，用来存放所有请求的Promise对象
const requestPromises = [];
for (let i = 0; i < 10; i++) {
  const url = `http://www.myapi.com/api/?id=${i}`;
  // 把每个axios请求的Promise加入数组
  requestPromises.push(axios.get(url));
}

// 用Promise.all等待所有请求完成
Promise.all(requestPromises)
  .then(responses => {
    // responses是按请求顺序排列的响应数组
    const temp = responses.map(res => res.data);
    // 现在所有请求都完成了，放心做你想做的操作！
    console.log("所有请求处理完成：", temp);
  })
  .catch(error => {
    console.log("有请求出错了：", error);
  });

方法二：用Promise.allSettled允许部分请求失败 #

如果你的场景可以接受部分请求失败，不想因为某一个请求挂了就中断后续处理，那就用Promise.allSettled——它会等所有请求不管成功失败都结束后，返回每个请求的结果详情：

const requestPromises = [];
for (let i = 0; i < 10; i++) {
  const url = `http://www.myapi.com/api/?id=${i}`;
  requestPromises.push(axios.get(url));
}

Promise.allSettled(requestPromises)
  .then(results => {
    const temp = [];
    results.forEach((result, index) => {
      if (result.status === 'fulfilled') {
        // 请求成功，提取数据
        temp[index] = result.value.data;
      } else {
        // 请求失败，可做错误记录或设置默认值
        console.log(`第${index+1}个请求失败：`, result.reason);
        temp[index] = null;
      }
    });
    // 现在所有请求都处理完毕，不管成功失败
    console.log("全部请求处理结束：", temp);
  });

另外提一句：你原来的写法里用temp[i] = res['data']，虽然用let i的循环不会有索引混乱的问题，但异步请求的响应顺序不一定和发起顺序一致（比如第3个请求可能比第2个先返回），而用Promise.all的话，返回的结果顺序是严格和请求顺序对应的，会更稳妥。

备注：内容来源于stack exchange，提问作者whitebear