vue axios는 페이지를 전환할 때 요청 방법을 중단합니다.

아래 편집자는 페이지 전환 시 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 来区别
	  	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에서는 인터럽트 요청과 요청 오류가 발생합니다. 따라서 메시지를 사용하여 식별하십시오(인터페이스 반환에도 메시지가 있으므로 이를 통합하십시오).

다음은 라우팅 스위치 앞에 청취 라우터에 배치되는 요청을 중단하는 방법입니다. cancel은 게시물의 cancelToken에서 중단하는 방법입니다.

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

router.beforeEach((to, from, next) => { 
<span style="white-space:pre;"> </span>Vue.prototype.cancelAjax()  
 next(); 
});

Call post

<span style="white-space:pre;">   </span>this.post(this.ajaxUrl + &#39;getCrTree&#39;,{ 
    devAddr : this.changeData.devAddr, 
    innerId : this.changeData.innerId, 
   }).then(ret=>{ 
    if(ret.status){ 
      
    }else{ 
     this.msg(ret.msg); 
    } 
   })

페이지 전환 시 위의 vue axios 중단 요청 방법 ajax는 편집자가 공유하는 모든 내용이기를 바랍니다. 참고자료를 주시고, PHP 중국어 웹사이트도 지원해 주시길 바랍니다.

관련 권장 사항:

WeChat 애플릿 개발을 위한 탭(창 하단의 TabBar) 페이지 전환 구현

jquery를 html과 결합하여 중국어와 영어 페이지 전환을 구현했습니다.

WeChat 공식 계정 메뉴가 두 번째로 전환되었습니다. 유효하지 않습니다

위 내용은 vue axios는 페이지를 전환할 때 요청 방법을 중단합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!