vue中页面跳转杀掉pending请求

解决思路：引用axios的CancelToken方法

vue目录，常规

用法如下：
1.在router的index文件中引入
a. import cancelTokenSources from ‘…/xhr/ajax’
b. router.afterEach(() => {
// 路由跳转杀请求
for (const [cancelToken, cancel] of cancelTokenSources) {
cancel(cancelToken) // cancel 正在pending的请求
}
})

2.在xhr/ajax中
a.定义const cancelTokenSources = new Map()
b.在axios的拦截器response中添加
if (response.config.cancelToken) {
cancelTokenSources.delete(response.config.cancelToken)
}
c.在axios的拦截器request中添加
if (!params.hasOwnProperty(‘cancelToken’)) {
// 排除不需要cancel的请求
const source = axios.CancelToken.source()

cancelTokenSources.set(source.token, source.cancel) // 加入cancel队列
params.cancelToken = source.token

}
d. export default cancelTokenSources

3.在xhr/api.ts中
在公共部分添加
var CancelToken = axios.CancelToken
var source = CancelToken.source()
在请求api中
function getdata(): Promise {
return ajax({
type: ‘get’,
url: /plan/en/plan,
cancelToken: source.token
}).then(getData)
}

以上三步即可实现此接口时页面跳转后杀掉当前pending中的请求