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 取消上次请求的更多相关文章

  1. axios取消接口请求

    axios取消请求 这里就是分析一下接口请求需要被取消时的一些操作 因为我是用vue写的项目,所以标配用的是axios,怎么在axios中取消已经发送的请求呢? 1.在这之前我们还是先介绍一下原生js ...

  2. Axios 取消 Ajax 请求

    Axios 取消 Ajax 请求 Axios XMLHttpRequest https://caniuse.com/?search=XMLHttpRequest https://developer.m ...

  3. vue axios配置 发起请求加载loading请求结束关闭loading

    axios带有请求拦截器,避免在每个请求里面加loading重复操作,可以封装进去,在请求开始时加载loading层,请求结束关闭,loading层用vux的loading加载 axios.js im ...

  4. vue --- axios发post请求后台接收不到参数的三种解决方案

    最近用vue  做项目使用axios 发送post 请求时遇到了前端传数据后端接收不到的情况: 后来仔细对比发现axios传值是这样的: 而 ajax 传值是这样的: 一个 Request Paylo ...

  5. vue+axios 对restful 请求封装

    礼拜天来公司整理项目,项目是最近开始重构的,里面的各种http请求接口是restful结构的(为了提升项目的比格),整理一下笔记 [restful介绍][1]博主讲的很详细 技术栈: vue + vu ...

  6. Vue axios封装 实现请求响应拦截

    封装 axios.js import axios from 'axios' import { baseURL } from '@/config' class HttpRequest { constru ...

  7. Asp.net MVC Vue Axios无刷新请求数据和响应数据

    Model层Region.cs using System; using System.Collections.Generic; using System.Linq; using System.Web; ...

  8. 请求超时VUE axios重新再次请求

    //在main.js设置全局的请求次数,请求的间隙 axios.defaults.retry = 4; axios.defaults.retryDelay = 1000; axios.intercep ...

  9. vue axios 发送post请求,后端接收参数为null

    1首先检查自己的传参方式是否正确,我是传一个对象,没有问题,接口也触发了 2查了下资料说是 Content-Type的问题,设置为   'application/x-www-form-urlencod ...

随机推荐

  1. java按照指定格式输出系统时间

    public class TimeFour { public static void main(String[] args) throws ParseException{ TimeFour four ...

  2. Phoenix安装

    第一步: 安装erlang虚拟机: 第二步: 安装Elixir Add Erlang Solutions repo: wget https://packages.erlang-solutions.co ...

  3. 关于GitHub

    gitHub是一个面向开源及私有软件项目的托管平台,因为只支持git 作为唯一的版本库格式进行托管,故名gitHub 对于程序员来说就相当于一个仓库可以把自己写的东西放到网上 要想使用GitHub必须 ...

  4. python基础第一天 3.27

    # #作业1# 猜年龄,可以让用户猜三次!age = 25user_guess = int(input("input your guess"))   age = 25count = ...

  5. erlang二进制

    在Erlang中写处理二进制数据的代码是洋溢着幸福感的,它对于二进制强大的表现力甚至能让你忘掉了它种种不便,今天我们说说Erlang的二进制数据处理. Erlang中bit string代表无类型的内 ...

  6. int 跟 Integer 的关系

    Integer是对象 Int是类型 比如 boolean 和Boolean就也不一样,long和Long等等 作为参数传递时要注意 要进行转换如下 int到Integer: int a=3; Inte ...

  7. node.js学习6---第三方依赖(模块或者说是包)的导入 npm 以及 cnpm命令的使用

    npm命令用于导入node.js的第三方包,相当于java中使用maven来导入第三方依赖: 1.npm init -y 命令:在命令窗口中执行后,会出现如下的json文件: 右边记录了安装的第三方包 ...

  8. 手动增加swap空间

           在日常工作中,swap没有必要搞那么大的空间,因为现在好多服务器都使用了ssd硬盘,这些硬盘还是比较贵的.如果服务器内存是128G,swap空间还设置成内存的两倍的话,那岂不是很明显是很 ...

  9. admin 显示多对多字段

    class BookAdmin(admin.ModelAdmin): def 作者(self, object): return [a.name for a in object.author.all() ...

  10. iphone html5页面禁止点击数字就打电话

    在html页面的head代码之间增加下面代码: <meta name="format-detection" content="telephone=no" ...