取消重复请求，只让最后一次请求经过

axios 请求拦截 取消重复请求（屡次重复异步，结束pending状态）

前端开发中，会涉及不少异步事件处理，页面展现的处理关系最密切的就是loading图层，可是loading交互在一些时候会不太友好，后端同窗也不喜欢loading状态（后端同窗：这不就是说个人接口返回慢嘛？个人锅！）
前端函数节流防抖也是一个解决方法，可是又有一个问题是，咱们处理的是异步，只要有异步就会有等待，好比，防抖时间是1s，异步事件触发了两次，就须要最快2s完成，假设第一次异步3s返回，第二次异步0.5秒返回；那出现的状况就是，第一次触发的3s异步，1s内没有返回，1s后第二次触发异步，第一次的异步尚未返回，第二次的异步就就开始了，0.5秒后第二次异步返回了，可是最终结果响应的是第一次的异步。

解决方案：利用axios能够很方便的取消重复请求的pending状态，结束重复请求，只让最后一次请求经过

官方文档： http://www.axios-js.com/zh-cn/docs/#%E5%8F%96%E6%B6%88

let pending = []; //声明一个数组用于存储每一个请求的取消函数和axios标识
let cancelToken = axios.CancelToken;
let removePending = (config) => {
    console.log('pending',pending);
    for(let p in pending){
        if(pending[p].u === config.url.split('?')[0] + '&' + config.method) { 
        //当当前请求在数组中存在时执行函数体
            pending[p].f(); //执行取消操做
            pending.splice(p, 1); //数组移除当前请求
        }
    }
}
//请求拦截
service.interceptors.request.use(function(config) { 
    /*.....*/
  removePending(config); //在一个axios发送前执行一下取消操做
  config.cancelToken = new cancelToken((c)=>{
        // pending存放每一次请求的标识，通常是url + 参数名 + 请求方法，固然你能够本身定义
    pending.push({ u: config.url.split('?')[0] +'&' + config.method, f: c});//config.data为请求参数
  });
   /*.....*/

})