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

相关推荐
夏天的味道٥39 分钟前
@JsonIgnore对Date类型不生效
开发语言·python
tsumikistep1 小时前
【前后端】接口文档与导入
前端·后端·python·硬件架构
行走的陀螺仪1 小时前
.vscode 文件夹配置详解
前端·ide·vscode·编辑器·开发实践
小白学大数据1 小时前
Python爬虫伪装策略:如何模拟浏览器正常访问JSP站点
java·开发语言·爬虫·python
2503_928411562 小时前
11.24 Vue-组件2
前端·javascript·vue.js
Bigger2 小时前
🎨 用一次就爱上的图标定制体验:CustomIcons 实战
前端·react.js·icon
SEO_juper2 小时前
别再纠结LLMs.txt了!它背后的真相与最佳使用场景,一文讲透。
开发语言·ai·php·数字营销
谢尔登2 小时前
原来Webpack在大厂中这样进行性能优化!
前端·webpack·性能优化
g***B7382 小时前
JavaScript在Node.js中的模块系统
开发语言·javascript·node.js
烤麻辣烫3 小时前
黑马程序员大事件后端概览(表现效果升级版)
java·开发语言·学习·spring·intellij-idea