axios 取消请求的处理

Axios 可以取消请求。Axios 提供了取消请求的功能，主要通过 CancelToken 类来实现。以下是如何使用 Axios 取消请求的详细步骤：

1. 引入 Axios：
   首先，确保你的项目中已经引入了 Axios 库。如果还没有引入，可以通过 npm 或 yarn 安装，或者在 HTML 文件中通过 <script> 标签引入。

2. 创建 CancelToken：
   使用 axios.CancelToken.source() 方法创建一个取消标记（cancel token）。这个方法会返回一个对象，该对象包含 token 和 cancel 两个属性。token 用于与请求关联，而 cancel 用于触发取消请求的操作。

3. 发送请求并关联取消标记：
   在发送请求时，将创建的取消标记的 token 属性作为请求配置的一部分传递给 Axios。这样，Axios 就知道这个请求是可以被取消的。

4. 取消请求：
   当需要取消请求时，调用取消标记的 cancel 方法，并传递一个可选的取消原因作为参数。调用这个方法后，Axios 会检测到关联的请求，并取消它。

5. 处理取消错误：
   在请求的 catch 块中，使用 axios.isCancel(error) 方法来检查错误是否是由取消请求引起的。如果是，你可以根据需要进行处理，比如显示一个取消请求的提示信息。

import axios from 'axios';

// 创建取消标记
const source = axios.CancelToken.source();

// 发送请求并关联取消标记
axios.get('/api/data', {
  cancelToken: source.token
}).then(response => {
  // 请求成功处理
}).catch(error => {
  if (axios.isCancel(error)) {
    console.log('请求被取消', error.message);
  } else {
    console.log('请求出错', error.message);
  }
});

// 取消请求
source.cancel('请求取消的原因');