axios 取消上一次的请求

在日常业务中，有时需要用到 ‘取消请求’（在防抖和节流不适用的情况下）。

---

注意⚠️：在axios 0.21及以下的版本中可用api：CancelToken

代码如下：

api:
export function apiGetList(query, config = {}) {
  return request({
    url: 'xxxxxxxx,
    method: 'get',
    params: query,
    ...config
  })
}


页面使用：
import axios from 'axios'

data:{
source: null
}

getList(){
 // 取消上一次的请求 （注意axios版本：0.21及以下使用：CancelToken）
 this.source && this.source.cancel()


 // 给请求添加token标记 
 this.source = axios.CancelToken.source()
 apiGetList(query,{cancelToken: this.source.token})
}

如果axios版本在 0.22 及以上可使用api：signal

举个栗子：

api:
export function apiGetList(query, config = {}) {
  return request({
    url: 'xxxxxxxx,
    method: 'get',
    params: query,
    ...config
  })
}


页面使用：
import axios from 'axios'

data:{
source: null
}

getList(){
 // 取消上一次的请求 （注意axios版本：0.21及以下使用：CancelToken）
 controller && controller.abort()
 // new 一个控制器
 controller = new AbortController()


 // 给请求添加标记 
 apiGetList(query,{signal: controller.signal})
}