vue axios 取消上次请求
axios.defaults.timeout = 1000 * 5
axios.defaults.baseURL = baseUrl
var CancelToken = axios.CancelToken;
let cancel;
export const api_prefix = '/face_recognition_app/v1.0';
var error_info={
code:402,
msg:"网络请求发生错误!"
};
//获取人员列表
export const personList = function () {
var args = util.argumentsFmt(arguments);//转换参数
var cancel=null;
Vue.axios.post( api_prefix + '/personquery',args.param,{ cancelToken: new CancelToken(function executor (c) {
cancel = c
})
} )
.then((res) => {
args.callBack(res.data);
})
.catch((e) => {
if (axios.isCancel(e)) {
console.log('Request canceled', e.message);
} else {
error_info.msg=e.message;
args.callBack(error_info);
} })
.finally(() => {
args.final()
})
return cancel;
} .vue文件中
data里添加
cancelList:[]
momethods{
cancelReq:function(){
for(let i=0;i<this.cancelList.length;i++){
if (typeof this.cancelList[i] === 'function') {
this.cancelList[i]();
}
}
},
getList:function (val) {
var _this=this;
if(!val||val==1){
_this.currentPage=1;
}
var param={
pageNum:val?val:1,
size:_this.pageSize
};
_this.cancelList.push(getPerson
personList(param,function (data) {
if(data.code==0){
_this.dataInfo=data.data;
_this.total=data.total;
_this.msg="暂无数据!"
}else{
_this.msg=data.msg?data.msg:'查询失败!';
}
_this.loading=false;
}));
}
},
watch: {
'$route' (to) { //监听路由是否变化
this.cancelReq();
this.cancelList=[];
this.urlType=to.name=='alarm'?'3':to.name=='discern'?'2':'1'
this.selectReset();
this.getList();
},
},
vue axios 取消上次请求的更多相关文章
- axios取消接口请求
axios取消请求 这里就是分析一下接口请求需要被取消时的一些操作 因为我是用vue写的项目,所以标配用的是axios,怎么在axios中取消已经发送的请求呢? 1.在这之前我们还是先介绍一下原生js ...
- Axios 取消 Ajax 请求
Axios 取消 Ajax 请求 Axios XMLHttpRequest https://caniuse.com/?search=XMLHttpRequest https://developer.m ...
- vue axios配置 发起请求加载loading请求结束关闭loading
axios带有请求拦截器,避免在每个请求里面加loading重复操作,可以封装进去,在请求开始时加载loading层,请求结束关闭,loading层用vux的loading加载 axios.js im ...
- vue --- axios发post请求后台接收不到参数的三种解决方案
最近用vue 做项目使用axios 发送post 请求时遇到了前端传数据后端接收不到的情况: 后来仔细对比发现axios传值是这样的: 而 ajax 传值是这样的: 一个 Request Paylo ...
- vue+axios 对restful 请求封装
礼拜天来公司整理项目,项目是最近开始重构的,里面的各种http请求接口是restful结构的(为了提升项目的比格),整理一下笔记 [restful介绍][1]博主讲的很详细 技术栈: vue + vu ...
- Vue axios封装 实现请求响应拦截
封装 axios.js import axios from 'axios' import { baseURL } from '@/config' class HttpRequest { constru ...
- Asp.net MVC Vue Axios无刷新请求数据和响应数据
Model层Region.cs using System; using System.Collections.Generic; using System.Linq; using System.Web; ...
- 请求超时VUE axios重新再次请求
//在main.js设置全局的请求次数,请求的间隙 axios.defaults.retry = 4; axios.defaults.retryDelay = 1000; axios.intercep ...
- vue axios 发送post请求,后端接收参数为null
1首先检查自己的传参方式是否正确,我是传一个对象,没有问题,接口也触发了 2查了下资料说是 Content-Type的问题,设置为 'application/x-www-form-urlencod ...
随机推荐
- MATLAB中a(:)和." ' "," ' "
今天继续学习matlab看书时发现了一行代码 a=a(:).'; 起初可能不懂就百度一下 a(:)可以将向量转换为列向量,行向量相当于直接转置,列向量不变 而如果是n*m维向量则仍然是以列为主,即按照 ...
- Linux之文件、目录
Linux之文件.目录 文件权限 User.Group.Others 在Linux中,任何一个文件都具有这三种身份的个别权限,三者的区别是 User: 指每一个单独的用户,例如member1,memb ...
- 小白的python之路11/15 awk 77-78
awk -F指定分隔符 eg下图指定 : 为分隔符,$1 $4 NF表示以分隔符为表准,该行分了几段 $NF表示取最后一段 正则表达式 表示打印第一个开头的用户名awk -F: '/nolog ...
- webbench安装使用
简介 运行在linux上的一个性能测试工具 官网地址:http://home.tiscali.cz/~cz210552/webbench.html 如果不能打开的话,也可以直接到网盘下载:http:/ ...
- storcli 简易使用介绍
MegaCli 是LSI公司官方提供的SCSI卡管理工具,由于LSI被收购变成了现在的Broadcom,所以现在想下载MegaCli,需要去Broadcom官网查找Legacy产品支持,搜索MegaR ...
- Python内存释放
python自己管理内存,实际上,对于占用很大内存的对象,并不会马上释放. 举例,a=range(10000*10000),会发现内存飙升一个多G,del a 或者a=[]都不能将内存降下来.. de ...
- 内嵌tomcat最简单用法
maven项目引入内嵌tomcat依赖 <dependency> <groupId>org.apache.tomcat.embed</groupId> <ar ...
- Kubernetes 常用命令
文章摘自:https://blog.csdn.net/felix_yujing/article/details/51622132 1 查看类命令--- # 查看集群信息 kubectl cluster ...
- pandas groupby生成新的dataframe
mark地址:https://blog.csdn.net/weixin_41784098/article/details/79486259
- HTML 基于 Python 实现分页功能
前面的话: 1. 网页引用的bootstrap 中的表格,所以需要引入样式类 2. 第一次写文章,不喜勿喷.有不足的地方,可留言我改正,在此先谢过. HTML代码: <!DOCTYPE html ...