在前端项目中，经常会遇到请求输入搜索的场景。防抖和拦截可以很好的处理频繁输入的问题，但是无法解决第一次请求结果发起后返回，覆盖上次搜索导致搜索结果不正确的问题。我将总结我常用的两种方法。使用时间戳过滤返回的结果。如果请求回调函数中的时间戳小于当前时间戳，则返回，表示请求结果已经处理完毕，请求过期。//远程搜索商品searchGoods(data){if(!data){returnreturn}if(this.isRemote){constreqCount=newDate().getTime()resthis.OrderInquireenQuerySpuAndUnit({}keyWord:=>{If(reQCount0){this.goodslist=res.data})。cach(err=>{{{console.log(err)}).finally(()=>{this.currentReqCount=reqCount})}}，基于axios封装的统一请求方式，后面发起的请求会取消前一个等待返回结果的请求，多次传输需要一个cancelTokenPath，表示本次请求由同一个输入组件发起参数查询）||{}//cancelTokenPath是为了避免在多个地方请求同一个连接，导致错误取消tore[cancelTokenPath].cancel('被最后一个请求取消')}store[cancelTokenPath]=source}returnnewPromise((resolve,reject)=>{Vue.axios.get(param.url,{params:restQuery||{},headers:param.headers||{},cancelToken:cancelTokenPath&&store[cancelTokenPath].token}).then(res=>{resolve(res)}).catch(err=>{r)reject})})}
