vue axios 在页面切换时中断请求 ajax

Vue.prototype.$ajax=axios;

const CancelToken = axios.CancelToken;
let cancel;
let cancelAjaxText = '中断成功';
Vue.prototype.post = function(url,data,loading){
  	var ajax = Vue.prototype.$ajax({
	          	method: 'post',
	          	url:url,
	          	data: data,
	          	cancelToken: new CancelToken(c => {  //强行中断请求要用到的
	            	cancel = c
	          	})
	        }).then(res =>res.data,res=>{   //中断请求和请求出错都会走这里，我这里用 cancelAjaxText  来区别
                        //注意:如果在切换下个页面的勾子created 就开始请求,这个请求会比这里跑得快,也就是在这里的前面
	        	if(res.message == cancelAjaxText){  
	        		return {status : false,msg:cancelAjaxText}
	        	}else{
	        		this.$confirm('登录过时，是否重新登录', '提示', {
			          	confirmButtonText: '确定',
			          	cancelButtonText: '取消',
			          	type: 'warning'
			        }).then(() => {
			          	window.location.href = Vue.prototype.url_head + '/';
			        }).catch(() => {
			          	       
			        });
	        	}
		   		 	
			})
  	return ajax;
};

接入 axios ,在POST方法里加入 cancelToken 数据，在上面else中，中断请求和请求出错都会走那里，所以用一个msg来识别(因为接口返回中也有一个msg，统一一下);

以下是 中断请求的方法,放在 路由切换的监听 router.beforeEach 中 ，cancel 是中断的方法，在post 的 cancelToken 里面拿出来的

Vue.prototype.cancelAjax = function(){ //切换页面强行中断请求 router.beforeEach中用到
	if(cancel){
		cancel(cancelAjaxText);
	}
}

router.beforeEach((to, from, next) => {
	Vue.prototype.cancelAjax()	
	next();	
});

调用post 

			this.post(this.ajaxUrl + 'getCrTree',{
				devAddr : this.changeData.devAddr,
				innerId : this.changeData.innerId,
			}).then(ret=>{
				if(ret.status){
					
				}else{
					this.msg(ret.msg);
				}
			})