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 ...
随机推荐
- Java 自增原理
很多人都知道 i++ 和 ++i 的区别 a = i++: a = i; i = i+1; a = ++ i; i = i + 1; a = i; 但碰到 i = i ++;的时候很多人就懵了? i是 ...
- Python P图
Python PIL PIL (Python Image Library) 库是Python 语言的一个第三方库,PIL库支持图像存储.显示和处理,能够处理几乎所有格式的图片. 一.PIL库简介 1. ...
- 软件151 王楚博 JavaEE的配置
一.准备以下压缩包 1.JDK1.7 文件:jdk1.7.rar 2. eclipse-jee-mars-2 文件:32位系统准备eclipse-jee-mars-2-win32.zip,64位系统准 ...
- jmeter的几种参数化方式
在用到jmeter工具时,无论做接口测试还是性能测试,参数化都是一个必须掌握且非常有用的知识点.参数化的使用场景,例如: 1)多个请求都是同一个ip地址,若服务器地址更换了,则脚本需要更改每个请求的i ...
- Django REST framework---请求和响应
Django REST framework---请求和响应 [Request对象] 概念: 平时我们在写Django的视图函数的时候,都会带上一个request参数,这样就能处理平时搭建网站时,浏览器 ...
- 较为复杂的实现Parcelable的子类--推荐Android中使用
2017-08-14 21:23:34 一个较为复杂的Parcelable实现类 public class CommentShareBean implements Parcelable { /** * ...
- 关于xml的相关知识
1 xml定义和用途 定义:XML (eXtensible Markup Language)即可扩展标记语言,它与HTML一样,都是SGML(Standard Generalized Markup ...
- Bouml快速使用指南
一.Bouml简介 Android 系统中有大量Java.C++代码,继承以及依赖关系非常复杂,Bouml可以用c++.Java.Idl.Php和Python建模及生成代码,反之也可通过uml工具更好 ...
- Maven中遇到Unsupported major.minor version 51.0错误
将错误复制到某度上,查询出结果显示JDK版本不匹配. 我按着步骤执行结束后还是有以下错误: 配置: Tomcat: 最终解决: 我在Initialize的时候使用的版本是JDK1.8的,导致的这个错误 ...
- PHP安装过程中问题详解
安装Apace时我就犯了一个大错误.因为我的母语是JAVA,我以为Tomcat就是Apache.其实不然,Tomcat是给Java用的,处理JSP等的动态页面. 而PHP则是单纯的用Apache安装A ...