vue 路由切换时中断axios请求
个人笔记在 apputil.js 文件中封装axios请求方法:var cancelArr=[];export { cancelArr }export function axiosPostATM(params, transCode){let axiosTemp = axios.create({baseURL: process.env.API_ROOT_ATM,cancelT...
·
个人笔记
在 apputil.js 文件中封装axios请求方法:
var cancelArr=[];
export { cancelArr }
export function axiosPostATM(params, transCode){
let axiosTemp = axios.create({
baseURL: process.env.API_ROOT_ATM,
cancelToken : new axios.CancelToken(cancel => {
cancelArr.push({cancel})
})
});
let finalUrl = 'TransServlet';//请求地址默认拼接TransServlet
let finalData = getparams(params, transCode, 'service');//配置上行报文公共包头
return new Promise(function(resolve, reject){
axiosTemp.post(finalUrl, finalData).then(response => {
let data = response.data;
if(data.returnCode == successCode){
resolve(data);
}else{
reject(data);
}
}).catch(error => {
let err;
if(error.message.indexOf('timeout') != -1){
err = {
returnMsg:'请求超时'
};
}else{
err = {
returnMsg:'通讯异常'
};
}
reject(err);
});
});
}
使用CancelToken来中断axios发起的请求,在 axios的配置中添加了如下代码:
cancelToken : new axios.CancelToken(cancel => {
cancelArr.push({cancel})
})
在 main.js 文件中添加路由切换时中断axios请求方法:
import { cancelArr } from './common/publicJs/apputil.js'
router.beforeEach((to, from, next) => {
cancelArr.forEach((ele,index)=>{
ele.cancel()
cancelArr.splice(index,1)
})
next()
})
这样就大功告成啦!
更多推荐
已为社区贡献1条内容
所有评论(0)