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() 方法来取消所有未完成的请求。

相关推荐
似水এ᭄往昔9 分钟前
【C++】--模板进阶
开发语言·c++
九章云极AladdinEdu10 分钟前
项目分享|告别枯燥命令行,构建终端用户界面的 TypeScript 库
javascript·ui·typescript
oil欧哟22 分钟前
文心 5.0 来了,百度大模型的破局之战
前端·人工智能·百度·prompt
东华帝君24 分钟前
react 切片 和 优先级调度
前端
洞窝技术40 分钟前
Next.js 不只是前端框架!我们用它搭了个发布中枢,让跨团队协作效率翻倍
前端·next.js
带着梦想扬帆启航1 小时前
UniApp 多个异步开关控制教程
前端·javascript·uni-app
小高0071 小时前
JavaScript 内存管理是如何工作的?
前端·javascript
yue0081 小时前
C# 求取整数的阶乘
java·开发语言·c#
是大林的林吖1 小时前
解决 elementui el-cascader组件懒加载时存在选中状态丢失的问题?
前端·javascript·elementui
鹏仔工作室1 小时前
elemetui中el-date-picker限制开始结束日期只能选择当月
前端·vue.js·elementui