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 ...
随机推荐
- webAR涉及的技术
1.技术体系 1.1技术体系整理 其中绿色底色的代表Demo中表现出的能力比较成熟,可以直接应用. 脑图地址:http://naotu.baidu.com/file/3392a895a9039 ...
- Struts中向显示界面传输数据
方法一:action类成员做对象成员,加getter,setter.例如: public class RegAction extends ActionSupport { private Login l ...
- 第一次实验报告x
C程序设计实验报告 实验项目:2.3.3字符与ASCII码,2.3.4运算符的表达式与应用,2.3.5顺序结构应用程序,3.3.1数学函数的算法描述,3.3.2鸡兔同笼的算法描述,3.3.3确定坐标的 ...
- cvte春招测试面试记录
cvte春招测试面试记录,挂在了综合面试(hr面)...尽量回忆面试的问题(可能不完全). 技术面一面: 1.自我介绍 2.根据实习项目问,智能客服怎么测正确率之类的. 3.测试人脸解锁 4.测试微信 ...
- hdu 1754 I Hate It 解题报告(线段树 代码+注释)
题目链接:传送门 I Hate It Time Limit: 9000/3000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Other ...
- 在eclispe上git 代码滚回
1.项目 - 鼠标右键 - team - show in history: 2.history窗口 - 选择需要回滚到的版本 - reset - hard:3.项目 - 鼠标右键 - team - p ...
- Android 面试100问- 0序0
准备找android方面的工作,现收集面试题,打算收集100个并记录
- 快速比较 Kafka 与 Message Queue 的区别
https://hackernoon.com/a-super-quick-comparison-between-kafka-and-message-queues-e69742d855a8 A supe ...
- Intellij IDEA xxx.properties变成纯文本模式解决方案
今天在创建xxx.properties的时候不知道按到了哪里,结果让它编程了纯文本模式,重命名这个文件或者删掉,重新创建这个同名文件,换一个项目,始终是文本文件类型,就估计不是项目问题,是intell ...
- python cmd的各种实现方法及优劣
Python_cmd的各种实现方法及优劣(subprocess.Popen, os.system和commands.getstatusoutput) 目前我使用到的python中执行cmd的方式有 ...