Maison > interface Web > js tutoriel > le corps du texte

vue axios interrompt la méthode de requête lors du changement de page

赶牛上岸
Libérer: 2018-03-06 14:42:04
original
1997 Les gens l'ont consulté

L'éditeur suivant partagera avec vous un article sur vue axios interrompant la méthode de requête ajax lors du changement de page. Il a une bonne valeur de référence et j'espère qu'il sera utile à tout le monde. Suivons l'éditeur pour jeter un œil

comme indiqué ci-dessous :

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;
};
Copier après la connexion

Connectez-vous à axios, dans Ajoutez les données CancelToken à la méthode POST. Dans l'autre élément ci-dessus, où iront la demande d'interruption et l'erreur de demande, utilisez donc un msg pour l'identifier (car il y a aussi un msg dans le retour de l'interface, unifiez-le) ; 🎜>

Ce qui suit est la méthode d'interruption de la requête, qui est placée dans le routeur d'écoute. avantChaque commutateur de routage Cancel est la méthode d'interruption, qui est extraite du CancelToken de la publication<. 🎜>

Vue.prototype.cancelAjax = function(){ //切换页面强行中断请求 router.beforeEach中用到 
 if(cancel){ 
  cancel(cancelAjaxText); 
 } 
}
Copier après la connexion
router.beforeEach((to, from, next) => { 
<span style="white-space:pre;"> </span>Vue.prototype.cancelAjax()  
 next(); 
});
Copier après la connexion
Appel du message

La méthode de demande d'interruption vue axios ci-dessus ajax lors du changement de page est tout le contenu que l'éditeur a partagé avec vous, j'espère qu'il pourra vous être utile Une référence, et j'espère que tout le monde soutiendra le site Web chinois php.

<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); 
    } 
   })
Copier après la connexion
Recommandations associées :

Implémentation du changement de page d'onglet (TabBar en bas de la fenêtre) pour le développement d'applets WeChat

Jquery combiné avec Implémentation HTML Changement de page en anglais

Le changement de page saisi à partir du menu du compte officiel WeChat a échoué pour la deuxième fois

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal