axios取消请求

创建一个取消请求函数,在需要请求的地方调用这个函数就行
在这里插入图片描述

这两行要写在外面

const CancelToken = axios.CancelToken;
let cancel;

这几行要插入axios中(封装了一个cancel函数)

axios.get(‘/user/12345’, {
cancelToken: new CancelToken(function executor© {
// executor 函数接收一个 cancel 函数作为参数
cancel = c;
})
});

在别的方法中调用cancel函数

cancel();

在这里插入图片描述

创建三个按钮
在这里插入图片描述
这个取消请求要在axios里面而不是单独封装的一个函数,给每个按钮设置这一个函数的时候,当点击取消按钮的时候每个相应的按钮就会执行这个取消请求的函数
在这里插入图片描述
最后在取消按钮上掉用这个函数(在你这个按钮先要取消的按钮上定义axios封装的取消请求函数)
在这里插入图片描述
一般情况下我们需要判断请求是否发出去了再取消,如果用户频繁点击请求按钮,这时我们需要取消之前的请求而发送最后一个请求
在这里插入图片描述
首先把cancel赋值为null,如果每次点击的话cancel会赋值成c,也就是说再次点击的时候cancel就不是null就会进入if语句,取消请求,等请求结束后就会把cancel赋值为null这样下次点击就不会进入if语句

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐