取消axios pending队列中的请求

取消axios pending队列中的请求

import axios from 'axios'

// 清除相同参数的请求
let allSamePendingList = []
const stringifyConfigRequest = config => {
  return config.url + JSON.stringify(config.params) + '&' + config.method + '&' + JSON.stringify(config.data)
}
let removeAllSamePending = (config) => {
    for(let p in allSamePendingList) {
        if(allSamePendingList[p].url === stringifyConfigRequest(config)) {
            allSamePendingList[p].f()
            allSamePendingList.splice(p, 1)
        }
    }
}

// 清除相同url的请求
let theSameUrlPendingList = []
let removeTheSameUrlPending = (config) => {
    for(let p in theSameUrlPendingList) {
        let apiUrl = theSameUrlPendingList[p].url.split('?')[0]
        if(config.url.indexOf(apiUrl) != -1）{
            theSameUrlPendingList[p].f()
            theSameUrlPendingList.splice(p, 1)
        }
    }
}

axios.interceptors.request.use(config => {
    if(config.isCancelTheSameUrl) {
        // 清除相同url的请求
        removeTheSameUrlPending(config)
        config.cancelToken = new axios.CancelToken( c => {
            theSameUrlPendingList.push({
                url: config.url,
                f: c
            })
        })
     } else {
         // 清除相同参数的请求
         removeAllSamePending(config)
         config.cancelToken = new axios.CancelToken( c => {
            allSamePendingList.push({
                url: stringifyConfigRequest(config),
                f: c
            })
        })
     }
     // other codes...

在axios文档中查询到，get请求url之后只能携带一个参数

所以当的get请求携带params参数时，应当进行如下处理

let params = {
    canShu1: 'canShu1',
    canShu2: 'canShu2'
}
let config = {
    params,
    isCancelTheSameUrl: true
}
axios
    .get('api', config)
    .then(res=> {
        // dealing
    })