axios如何一次发送多个并发请求？

在前端开发中，Axios 提供了几种方法来发送多个并发请求：

1. Promise.all: 这是最常用的方法，它接受一个 Promise 数组作为参数，并返回一个新的 Promise。当所有传入的 Promise 都 resolve 时，新的 Promise 才会 resolve，并将所有结果以数组形式返回。如果任何一个 Promise reject，新的 Promise 也会 reject。

import axios from 'axios';

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

Promise.all(requests)
  .then(responses => {
    const users = responses[0].data;
    const products = responses[1].data;
    const orders = responses[2].data;
    // 处理数据...
  })
  .catch(error => {
    console.error('Error:', error);
  });

2. axios.all: 这是 Axios 提供的更便捷的方法，其底层也是基于 Promise.all。它接受一个 Axios 请求数组作为参数，用法与 Promise.all 类似。

import axios from 'axios';

axios.all([
  axios.get('/api/users'),
  axios.get('/api/products'),
  axios.get('/api/orders')
])
  .then(axios.spread((usersRes, productsRes, ordersRes) => {
    const users = usersRes.data;
    const products = productsRes.data;
    const orders = ordersRes.data;
    // 处理数据...
  }))
  .catch(error => {
    console.error('Error:', error);
  });

axios.spread 可以将 axios.all 返回的结果数组展开成独立的参数，方便直接使用。

3. for...of 循环 + async/await: 这种方法可以按顺序发送请求，但每个请求仍然是异步的。如果需要在上一个请求完成后才发送下一个请求，则应该使用这种方法。

import axios from 'axios';

async function fetchData() {
  const urls = ['/api/users', '/api/products', '/api/orders'];
  const results = [];

  for (const url of urls) {
    try {
      const response = await axios.get(url);
      results.push(response.data);
    } catch (error) {
      console.error('Error:', error);
      // 可以选择在这里继续执行或中断循环
    }
  }

  // 处理 results 数组...
  console.log(results);
}

fetchData();

选择哪种方法取决于你的具体需求：

• 如果你需要所有请求都成功才处理数据，并且希望并发执行，那么 Promise.all 或 axios.all 是最佳选择。
• 如果你需要按顺序发送请求，或者需要根据前一个请求的结果决定是否发送下一个请求，那么 for...of 循环 + async/await 更合适。

希望这些信息能帮到你！