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 ...
随机推荐
- js定义函数方式有。。。
1,常见方式 function fun(data,...){ console.log(data); } 注:随处可调用 2. 函数直接定义函数 var fun = function (data,.. ...
- Spark 中Java实现数据库Row转Rating
Dataset<Row> ratings = mlsc.sql("SELECT user,movie,rating FROM data");JavaRDD<Row ...
- Saiku数据库迁移H2迁移到Mysql(二十二)
Saiku数据库迁移H2迁移到Mysql Saiku默认使用H2数据库来存储saiku的用户与角色信息,我们可以根据角色来做saiku的权限控制,然后将角色分配给用户 ,该用户就会有对应的约束了! 由 ...
- H5横向滚动提示
<marquee>啦啦啦,Hello World</marquee>
- 记初学python的一些心得
人生苦短,我用python! 其实我自学python也很长一段时间了,但总是去更换学习资料,搞的现在学的不是很好,因为没更换次资料都要从头开始学起,那么分享下我的学习战况吧,不是很好,还将就的能看. ...
- Vultr新用户充值优惠 – 最多充值100美元送100美元
Vultr商家向来是搅局的,当初海外VPS商家被Linode一家独大的时候,由于VULTR商家进入市场进行相似产品的营销,使得目前我们看到海外主机商各种低价.当然这些说法也有些武断,但是肯定是有一定的 ...
- HashMap jdk1.8 jdk1.7 put改动
之前hashmap处理冲突单纯使用链表法进行链接,1.8中,当一散列值中对应的链表长度超过8个后,会将链表转化为红黑树进行存储. 1.8中源码 public V put(K key, V value) ...
- callback理解
ex: var fn1 = function(callback){ //do something callback && c ...
- shell练习题7
需求如下: 输入一串随机数字,然后按千分位输出. 例如:输入随机数字为"123456789",输出为123,456,789 参考解答如下 -方法1 [root@lanquark s ...
- Jsの练习-数组常用方法 -forEach()
forEach() : 对数组进行遍历循环,对数组中的每一项运行给定函数. 格式: arr.forEach(function(value,index){}) <!DOCTYPE html> ...