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 => {      }) }

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