const CANCEL_TOKEN = axios.CancelToken;
Vue.prototype.$httpRequestList = []; //管理所有请求中断方法的集合
axios({
url: url,
methods: 'POST',
data: options,
cancelToken: new CANCEL_TOKEN(c => {
Vue.prototype.$httpRequestList.push(c); //中断请求时,将对应中断方法存进集合
})
}).then(res => {}).catch(err => {
if (err.message == "interrupt") {
console.log('已中断请求');
return;
}
})
/**
* 使用路由守卫,在切换页面前中断上一个页面的所有请求
*/
router.beforeEach((to, from, next) => {
if(Vue.$httpRequestList.length>0){ //检查是否有需要中断的请求
Vue.$httpRequestList.forEach(item=>{//遍历,执行中断方法并传入中断信息
item('interrupt');
})
}
next();
});
vue 使用axios在跳转下一页面前取消所有请求
最新推荐文章于 2023-03-03 20:01:09 发布