axios CancelToken 取消频繁发送请求的用法

1.全局配置一下 

const CancelTokan = axios.CancelToken

export const postRequest = (url,params,_this) =>{return axios ({methods:'post',

url:`${base}${url}`,

data:params,

//这是重点

cancelToken:new CancelToken(

functon executor(c){

//1.cancel函数赋值给cancelRequest属性

//从而可以通过 cancelRequest执行取消请求的操作

if(_this != undefind){

_this.cancelRequest = c

}

)}

headers:{

token:''

}

)}

2.设置一个变量

  cancelRequest: null, // 初始时没有请求需要取消,设为null

3.使用

  getGoodslistAction() {

      //防止重复提交 取消上一次的请求

      if (typeof this.cancelRequest === 'function') {

        this.cancelRequest()

      }

 postRequest("/api/v1/pc/goods/list", { }, this).then(res => {      }) }


这样的话  我们在连续发送相同的请求的时候  第二次的请求就会被我们取消掉 不会因为数据返回慢 而把数据覆盖。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。