封装axios 批量取消请求

在使用 Axios 进行请求时，有时候我们需要取消一些请求，以避免不必要的网络请求和资源浪费。此时，我们可以使用 Axios 提供的 CancelToken 来实现请求的取消。

下面是一个封装了批量取消请求功能的 Axios 实例：

import axios from 'axios';

// 创建一个 Axios 实例
const instance = axios.create({
  baseURL: 'https://api.example.com',
  timeout: 10000,
});

// 创建一个取消令牌
const CancelToken = axios.CancelToken;
const source = CancelToken.source();

// 封装批量取消请求函数
function cancelRequests(requests) {
  requests.forEach((request) => {
    if (request.cancel) {
      request.cancel();
    }
  });
}

// 发送请求
const requests = [
  instance.get('/users/1', { cancelToken: source.token }),
  instance.get('/users/2', { cancelToken: source.token }),
  instance.get('/users/3', { cancelToken: source.token }),
];

// 执行批量取消请求
cancelRequests(requests);

在上面的代码中，我们首先创建了一个 Axios 实例，并且使用 `CancelToken` 创建了一个取消令牌 `source`。然后，我们发起了三个请求，并且将 `cancelToken` 配置为 `source.token`。最后，我们封装了一个 `cancelRequests` 函数，该函数接收一个请求数组，遍历每个请求并执行取消操作。

使用这种方式，我们可以灵活地取消请求，避免不必要的网络请求和资源浪费。