vue终止已发送的axios请求

项目中碰到了一种情况：同一界面中，数据信息比较复杂或者比较大，网络请求比较慢，并且还需要多种数据可以切换显示，如果我们在上一个数据未请求完成时便切换到下一个数据显示，则可能会造成界面上的数据显示错误，这时，我们就需要在请求下一数据之前将上一个请求任务终止掉；
方式一：

const CancelToken = axios.CancelToken;
const source = CancelToken.source();
// get请求
axios.get('/user/12345', {
  cancelToken: source.token
}).catch(function (thrown) {
  if (axios.isCancel(thrown)) {
    console.log('Request canceled', thrown.message);
  } else {
    // handle error
  }
});
// post请求
axios.post('/user/12345', {
  name: 'new name'
}, {
  cancelToken: source.token
})

// cancel the request (the message parameter is optional)
source.cancel('Operation canceled by the user.');

方式二：

const CancelToken = axios.CancelToken;
let cancel;

axios.get('/user/12345', {
  cancelToken: new CancelToken(function executor(c) {
    // An executor function receives a cancel function as a parameter
   	cancel = c;
  })
});

// cancel the request
cancel();

我用的是第二种方式，由于我是把axios的请求提取到单独的js文件中，所以使用let定义cancel并export后，在其他vue页面调用cancel,一直是初始值，并没有调用到被赋值后的cancel,所以我使用window.cancel进行定义，最终才能成功终止之前的axios请求。

参考地址：https://github.com/axios/axios#cancellation