Vue与服务器端通信的刨析：如何处理并发请求

import axios from 'axios';// 创建axios实例const instance = axios.create({  baseURL: 'http://api.example.com',  timeout: 5000});// 请求1const request1 = instance.get('/users');// 请求2const request2 = instance.get('/orders');// 请求3const request3 = instance.get('/products');// 并发发送请求axios.all([request1, request2, request3]).then(axios.spread(function (res1, res2, res3) {  // 请求1的响应数据  console.log(res1.data);  // 请求2的响应数据  console.log(res2.data);  // 请求3的响应数据  console.log(res3.data);})).catch(function (error) {  console.log(error);});

axios.all([request1, request2, request3]).then(axios.spread(function (res1, res2, res3) {  // 请求1的响应数据  console.log(res1.data);  // 请求2的响应数据  console.log(res2.data);  // 请求3的响应数据  console.log(res3.data);})).catch(function (error) {  if (axios.isCancel(error)) {    console.log('请求被取消');  } else {    console.log('请求发生错误');    console.log(error);  }});

let cancel;// 取消请求function cancelRequest() {  if (typeof cancel === 'function') {    cancel('请求被取消');  }}// 发送请求function sendRequest() {  cancelRequest();  // 创建新的取消令牌  const source = axios.CancelToken.source();  // 发送请求  axios.get('/search', {    cancelToken: source.token  }).then(function (res) {    console.log(res.data);  }).catch(function (error) {    if (axios.isCancel(error)) {      console.log('请求被取消');    } else {      console.log('请求发生错误');      console.log(error);    }  });  // 存储取消令牌  cancel = source.cancel;}