1.全局配置一下
const CancelTokan = axios.CancelToken
export const postRequest = (url,params,_this) =>{return axios ({methods:'post',
url:`${base}${url}`,
data:params,
//这是重点
cancelToken:new CancelToken(
functon executor(c){
//1.cancel函数赋值给cancelRequest属性
//从而可以通过 cancelRequest执行取消请求的操作
if(_this != undefind){
_this.cancelRequest = c
}
)}
headers:{
token:''
}
)}
2.设置一个变量
cancelRequest: null, // 初始时没有请求需要取消,设为null
3.使用
getGoodslistAction() {
//防止重复提交 取消上一次的请求
if (typeof this.cancelRequest === 'function') {
this.cancelRequest()
}
postRequest("/api/v1/pc/goods/list", { }, this).then(res => { }) }
这样的话 我们在连续发送相同的请求的时候 第二次的请求就会被我们取消掉 不会因为数据返回慢 而把数据覆盖。