axios取消请求

Axios 使用 cancel token 取消请求

1、先在axios请求中加上cancelToken

复制代码
import request from '../utils/request' // 配置过的Axios 对象
import axios from 'axios' 

export function getDetail(params, that) { 
  return request({
    url: '/api/indexlineage/detail', 
    method: 'get',
    params: params,
    cancelToken: new axios.CancelToken(function executor(c) { // 设置 cancel token
      that.source = c;
    })
  })
}

2、在组件中调用

复制代码
import { getDetail} from "../api";
export default {
    data() {
      return {
        source: null
      }
    },
    methods: {
      cancelQuest() {
        if (typeof this.source === 'function') {
          this.source('终止请求'); //取消请求
        }
      },
      getDetailData(val) {
        this.cancelQuest() // 请求发送前调用
        let params = {
            id: '1',
        }
        getDetail(params, this).then(res => {
              console.log(res)
            }
        )
    }
}
相关推荐
PEI0412 分钟前
MVCC(多版本并发控制)
java·开发语言·数据库
Hierifer17 分钟前
跨端技术:浅聊双线程原理和实现
前端
FreeBuf_28 分钟前
加密货币武器化:恶意npm包利用以太坊智能合约实现隐蔽通信
前端·npm·智能合约
熊猫钓鱼>_>35 分钟前
2025反爬虫之战札记:从robots.txt到多层防御的攻防进化史
开发语言·c++·爬虫
java水泥工1 小时前
基于Echarts+HTML5可视化数据大屏展示-图书馆大屏看板
前端·echarts·html5
EndingCoder1 小时前
Electron 性能优化:内存管理和渲染效率
javascript·性能优化·electron·前端框架
半夏陌离1 小时前
SQL 实战指南:电商订单数据分析(订单 / 用户 / 商品表关联 + 统计需求)
java·大数据·前端
子兮曰1 小时前
🚀Vue3异步组件:90%开发者不知道的性能陷阱与2025最佳实践
前端·vue.js·vite
牛十二1 小时前
mac-intel操作系统go-stock项目(股票分析工具)安装与配置指南
开发语言·前端·javascript
励志不掉头发的内向程序员1 小时前
从零开始的python学习——文件
开发语言·python·学习