参考博客:
https://blog.csdn.net/sinat_38959166/article/details/104173187
https://www.jianshu.com/p/e99cbfbce7e2
前言
最近在看一些库的原理,正好看到了axios cancel Promise的相关文章,理解后,以免忘记,写一篇博客记录一下。
用法
1.使用 CancelToken.source 工厂方法创建 cancel token
// CancelToken是一个构造函数,用于创建一个cancelToken实例对象
// cancelToken实例对象包含了一个promise属性,值为可以触发取消请求的一个promise
const CancelToken = axios.CancelToken;
// 执行source()得到的是一个包含了cancelToken对象和一个取消函数cancel()的对象
// 即 source = {token: cancelToken对象, cancel: 取消函数}
const source = CancelToken.source();
// 在请求的配置中配置cancelToken,那么这个请求就有了可以取消请求的功能
axios.get('/data', {
cancelToken: source.token
}).catch(function(thrown) {
if (axios.isCancel(thrown)) {
console.log('Request canceled', thrown.message);
} else {
// 处理错误
}
});
2.通过传递一个 executor 函数到 CancelToken 的构造函数来创建 cancel token
const CancelToken = axios.CancelToken;
let cancel;
axios.get('/data', {
cancelToken: new CancelToken(function executor(c) {
// executor 函数接收一个 cancel 函数作为参数
// 把cancel函数传递给外面,使得外面能控制执行取消请求
cancel = c;
})
});
// cancel the request
cancel();