vue，axios处理同一个接口多次访问的执行顺序问题

碰到个问题记录一下，就是axios同时多次请求同一个接口（参数不同）导致数据混乱的问题，就是先点击A，马上再点击B，结果A请求数据的速度比B的慢，导致，展示数据的时候B的结果先出来，又马上闪成A请求的数据了。这里有一种解决办法，在点击新的接口请求时，关闭之前正在pending的接口请求。在已经封装好的axios方法里面，加上红框中代码，然后再在你需要的vue文件方法里面加上如下代码这样你...

Mr丶零一

5646人浏览 · 2019-08-02 16:12:29

Mr丶零一 · 2019-08-02 16:12:29 发布

碰到个问题记录一下，就是axios同时多次请求同一个接口（参数不同）导致数据混乱的问题，就是先点击A，马上再点击B，结果A请求数据的速度比B的慢，导致，展示数据的时候B的结果先出来，又马上闪成A请求的数据了。这里有一种解决办法，在点击新的接口请求时，关闭之前正在pending的接口请求。
在这里插入图片描述
在已经封装好的axios方法里面，加上红框中代码，然后再在你需要的vue文件方法里面加上如下代码

这样你每点击一个事件触发新的请求时，之前仍在pending的请求就会被强制关闭了

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^