vue3中 Promise.all 的使用

在 Vue.js 3 中，`Promise.all`是一个非常有用的工具，特别是在处理多个并发的异步操作时。它接收一个Promise数组作为输入，然后返回一个新的Promise，只有当所有的Promise都成功解析（resolve）时，这个新Promise才会解析，反之则会被拒绝（reject）。

例如，假设你在组件中需要同时获取多个API的数据，你可以这样做：

const tasks = [
  axios.get('/api/users'),
  axios.get('/api/products'),
  axios.get('/api/orders')
];

// 使用Promise.all等待所有请求完成
Vue.prototype.$asyncAll = async function(tasksArray) {
  try {
    const [users, products, orders] = await Promise.all(tasksArray);
    return { users, products, orders };
  } catch(error) {
    console.error('An error occurred:', error);
    throw error;
  }
};

this.$asyncAll(tasks)
  .then((responses) => {
    // 处理获取到的所有数据
    this.users = responses.users;
    this.products = responses.products;
    this.orders = responses.orders;
  })
  .catch((error) => {
    // 某个请求失败时的错误处理
    console.error('Failed to fetch data', error);
  });

在这个例子中，`$asyncAll`方法封装了`Promise.all`，并在成功时解构响应，方便后续使用。如果任何一个请求失败，`Promise.all`会立即拒绝，我们可以在`.catch`块中处理错误。