vue中循环请求接口参数问题

最新推荐文章于 2024-06-29 09:58:52 发布

STARSHOME火星

最新推荐文章于 2024-06-29 09:58:52 发布

阅读量2.3k

点赞数

CC 4.0 BY-SA版权

文章标签： vue.js 前端 typescript 同步

本文链接：https://blog.csdn.net/qq_36539696/article/details/122357723

本文探讨了一个关于JavaScript中循环请求的问题，通过将同步函数改为异步函数并使用`await`关键字，解决了接口请求参数重复导致数据一致性的难题。关键在于理解异步操作在循环中的执行顺序。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天遇到一个循环请求问题
先上代码

function(){
      var num = this.eventType.length;
      for (var i = 0; i < num; i++) {
        arr.eventType = this.eventType[i];
        console.log(arr.eventType, i, "arr");
        this.getChart(arr);
        this.getPie(arr);
      }
}
    getChart(arr) {
    //接口请求
    },
    getPie(arr) {
    //接口请求
    },

问题出在eventype上，在接口请求前打印出的eventype都是不一样的，在接口里面打印，每次都是一样的，这导致每次接口的请求参数都是一样，获取的数据也是一样。

搞了半天才找到原因，修改如下


async function(){
      var num = this.eventType.length;
      for (var i = 0; i < num; i++) {
        arr.eventType = this.eventType[i];
        console.log(arr.eventType, i, "arr");
        await this.getChart(arr);
        await this.getPie(arr);
      }
}
    async getChart(arr) {
    await //接口请求
    },
    async getPie(arr) {
    await //接口请求
    },