vue使用async和await解决请求异步问题，确保请求返回结果再执行下面的代码

待我称王封你为后i 2023-02-18 09:45 2阅读 0赞

[参考解决vue请求异步问题][vue]

*  自己代码

afterRequest(result) { 
       //支持高亮提示，提示标准差远高于平均标准差的坐席组别
       //获取每个坐席组的坐席数据
       this.getDataEveryRepGroup(result).then(res=>{ 
           const _self = this;
    
           //求每个坐席组数据标准差
           for (let i = 0; i < this.repGroupData.length; i++) { 
               let sum = function (x, y) { 
                   return x + y;
               };　　//求和函数
               let square = function (x) { 
                   return x * x;
               };　　//数组中每个元素求它的平方
               let data = this.repGroupData[i].countArr;   //所计算的数组
               let mean = data.reduce(sum) / data.length;
               let deviations = data.map(function (x) { 
                   return x - mean;
               });
               //标准差
               let stddev = Math.sqrt(deviations.map(square).reduce(sum) / (data.length - 1));
               this.repGroupData[i].stddev = stddev;
           }
    
           //标准差的和
           let stddevSum = 0;
           for (let i = 0; i < this.repGroupData.length; i++) { 
               stddevSum +=  this.repGroupData[i].stddev;
           }
           //平均标准差
           let stddevAvg = stddevSum / this.repGroupData.length;
    
           for (let i = 0; i < this.repGroupData.length; i++) { 
               //如果标准差大于平均标准差
               if (this.repGroupData[i].stddev > stddevAvg) { 
                   //记住这个坐席组名称，高亮
                   _self.highlightRepGroup.push(this.repGroupData[i].repGroup)
               }
           }
           //需要高亮的坐席组
           console.log("this.highlightRepGroup-需要高亮的坐席组")
           console.log(this.highlightRepGroup)
    
           //取他们横坐标的索引（柱条的索引）
           let highlightIndex = []
           for (let i = 0; i < this.highlightRepGroup.length; i++) { 
               for (let j = 0; j < result.length; j++) { 
                   if (this.highlightRepGroup[i] === result[j].repGroupName) { 
                       highlightIndex.push(j);
                   }
               }
           }
    
           console.log("需要高亮的柱条的索引")
           console.log(highlightIndex)
    
           let _options = JSON.parse(JSON.stringify(this.chartOptions));
           let _temp_options = barRender(this.dimensionData, this.measureData, _options, result, this.styleSel);
           if (_temp_options) { 
               _self.chartOptions = _temp_options;
           }
    
           //改变柱条的颜色
           for (let i = 0; i < highlightIndex.length; i++) { 
               _self.chartOptions.series[0].data[highlightIndex[i]] = { 
                   value: _self.chartOptions.series[0].data[highlightIndex[i]],
                   itemStyle: { 
                       color:'#E062AE'
                   }
               }
           }
    
           this.reLoad = false;
           this.$nextTick(() => { 
               this.reLoad = true;
           });
    
       });
    },
    
    //执行请求的方法
    async getDataEveryRepGroup(result){ 
        //获取每个坐席组中坐席的数据，求标准差
        let params = { }
        this.initParams(params);
    
        //在screen中添加坐席组
        let repGroupScreen = [{ 
            fieldName: "repGroupName",
            field: "repGroupName",
            operation: "=",
            iValue: "zuoxizu",
            relation: ""
        }]
        params.screen.push(repGroupScreen)
    
        const _self =this;
        //替换iValue
        let paramsArr = []
        for (let i = 0; i < result.length; i++) { 
            let repGroup = result[i].repGroupName;
            let _params = JSON.parse(JSON.stringify(params))
            _params.screen[params.screen.length - 1][0].iValue = repGroup
            paramsArr.push(_params);
        }
    
        for (let i = 0; i < paramsArr.length; i++) { 
            await getChartData(paramsArr[i]).then(res => { 
                //拿到每个坐席组的结果
                console.log(res)
                let countArr = []
                for (let j = 0; j < res.length; j++) { 
                    countArr.push(res[j].count);
                }
                let data = { 
                    "repGroup" : result[i].repGroupName,
                    "countArr" : countArr
                }
                _self.repGroupData.push(data)
            })
        }
    
        console.log("this.repGroupData1")
        console.log(this.repGroupData)
    }

[vue]: https://blog.csdn.net/qq_42751248/article/details/103591875