路由跳转时,上一个路由里的请求应被取消
axios请求头设置(axios.js)
const CancelToken = axios.CancelToken;
axios.interceptors.request.use(
config => {
config.cancelToken = new CancelToken(function(cancel){
store.commit('pushToken', {
cancelToken: cancel
})
})
}
)
router/index.js(路由守卫)
router.beforeEach((to, from, next) => {
store.commit('clearToken'); // 取消请求
....
})
store.js
//state
cancelTokenArr: [], // 取消请求token数组
//mutation
pushToken(state, payload){
state.cancelTokenArr.push(payload.cancelToken);
},
clearToken({cancelTokenArr}){
cancelTokenArr.forEach(item => {
item('路由跳转取消请求');
});
cancelTokenArr = [];
}
将取消方法cancel放到数组中,然后在路由守卫中把数组中存有的cancel方法都执行