vue 请求接口快慢 覆盖 解决方案

vue 请求接口快的被慢的覆盖的问题，有一个接口比较慢，当created去调用函数请求的时候，数据还没回来，就去筛选数据，筛选数据的调用比较快，很快就回来了，但当慢的相应回来之后，导致快的结果覆盖了慢的结果，如何解决呢？

注意：还有一个前提是：同一个接口，但是参数不同。

---

解决方案：

先不用AbortController去取消，我知道可能你想到的是这个。

而且一般项目当中都是封装在同一个请求文件，这个时候就需要考虑不同请求地址不同参数等等不同的前提条件。

所以首先考虑看看能不能用标识这种写法先去写，（如果需求催得急的情况）：

let currentRequestId = 0

async function fetchData(params) {
  const requestId = ++currentRequstId;
  
  try {
    const response = await api.get('/data', { params });
    
    // 检查是不是最新的请求，不是的话，不走下去了
    if (requestId !== currentRequestId) {
      return
    }
    
    return response.data;
    
  } catch (error) {
    if (requestId !== currentRequestId) {
      console.log('已忽略过时的错误')
      return
    }
    throw error
  }
}