axios全局封装取消请求,你可以创建一个 Axios 实例,并为该实例配置默认的 CancelToken

js 复制代码
import axios from 'axios';  
  
// Axios 的 CancelToken  
const CancelToken = axios.CancelToken;  
  
// 创建一个 Axios 实例  
const instance = axios.create();  
  
// 用于存储所有的 cancel 函数  
const pendingRequests = new Set();  
  
// 添加请求配置  
instance.interceptors.request.use(config => {  
  // 为每个请求创建一个新的 cancelSource  
  const cancelSource = CancelToken.source();  
  pendingRequests.add(cancelSource.cancel);  
  config.cancelToken = cancelSource.token;  
  return config;  
});  
  
// 提供一个取消所有请求的方法  
instance.cancelAll = () => {  
  pendingRequests.forEach(cancel => cancel());  
  pendingRequests.clear();  
};  
  
export default instance;

可以在你的应用中使用这个封装过的 Axios 实例,并通过调用 instance.cancelAll() 方法来取消所有未完成的请求。

相关推荐
王家视频教程图书馆17 小时前
android java 开发网路请求库那个好用请列一个排行榜
android·java·开发语言
POLITE317 小时前
Leetcode 238.除了自身以外数组的乘积 JavaScript (Day 7)
前端·javascript·leetcode
光影少年17 小时前
AI前端开发需要会哪些及未来发展?
前端·人工智能·前端框架
小宇的天下17 小时前
Calibre Introduction to Calibre 3DSTACK(1)
开发语言
Vincent_Vang17 小时前
多态 、抽象类、抽象类和具体类的区别、抽象方法和具体方法的区别 以及 重载和重写的相同和不同之处
java·开发语言·前端·ide
qualifying17 小时前
JavaEE——多线程(3)
java·开发语言·java-ee
菩提小狗17 小时前
小迪安全_第4天:基础入门-30余种加密编码进制&Web&数据库&系统&代码&参数值|小迪安全笔记|网络安全|
前端·网络·数据库·笔记·安全·web安全
Fate_I_C17 小时前
Kotlin 中的 suspend(挂起函数)
android·开发语言·kotlin
闲蛋小超人笑嘻嘻17 小时前
非父子通信: provide和inject
前端·javascript·vue.js
周亚鑫17 小时前
vue3 js代码混淆
开发语言·javascript·ecmascript