项目浅试async，await

项目浅试async，await

项目中第一次主动使用async，await，记录一波

项目所遇问题场景

在执行一个方法的时候，预想先拿到数据处理后，使用高德地图的覆盖物群组来管理覆盖物，但是发现先执行了下面的代码才执行上面的代码，由于先渲染了地图而没有数据，导致覆盖物获取数据失败。如下：

后执行的initAllData方法

解决方法

使用async、await，等待initAllData方法执行后再执行initPathData下的内容。由于await等待的是一个Promise对象，所以要在initAllData()中new一个promise对象，使其生效。

// 拿到后台图形点数据进行格式化，并触发展示对应图形
    async initpathData(){
      await this.initAllData()
      
      // 使用覆盖物群组来管理覆盖物，以避免通过循环来一个个设置属性。
       var overlayGroups = new AMap.OverlayGroup(this.polygons);
      
      // 统一添加到地图实例上
        this.map.add(overlayGroups);
      
      // 给覆盖物群组添加点击事件
      let that = this
        overlayGroups.on('rightclick',function(e){
          that.$confirm("是否要删除本果园范围", '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            // 删除某一覆盖物
            let id = e.target._opts.extData.id
            that.getDelete(id)
            overlayGroups.removeOverlay(e.target)
            that.$message({
              type: 'success',
              message: '删除成功'
            });
          }).catch(() => {
            that.$message({
              type: 'info',
              message: '已取消'
            });          
          });
        })
        overlayGroups.on('click',function(e){
          console.log(e);
          //实例化信息窗体
          that.infoWindow = new AMap.InfoWindow({
            content: e.target._opts.extData.name,
          });
          let point = e.target._opts.path[0]
          that.infoWindow.open(that.map,point)
        })
    },

 	initAllData(){
      return new Promise((resolve, reject) => {
         // 请求数据 并处理
        queryCartography({type:0}).then(res=>{
          // console.log(res,'查询果园范围');
          var data = res.data.rows
          // data.splice(data.length-3)
          this.tableData = data

          const itemData = this.tableData
          for(let a =0; a<itemData.length; a++){
            let id = itemData[a].id
            let name = itemData[a].name
           
          // 将获取的geojson数据格式化
            let list = itemData[a].scopeData
              let path = []
              let listItems1 = list.substring(list.indexOf("[[",0)+1)
              let listItems2 = "["+listItems1.slice(0,-5)+"]"
              // 将它转化为数组
              let arr =  eval('(' + listItems2 + ')');
              // 此时数据格式为 一个组数中有几个以数组格式的点坐标
              for( let i = 0; i<arr.length; i++){
                // 这里的每一个i为一个数组格式的点坐标的经纬度[114.200547, 24.09305]
                let point = arr[i]
                path.push(new AMap.LngLat(point[0],point[1]));
              }
              this.showAddPolygon(path,id,name)
          }
          resolve()
        })
      })
    },

小白一只，详细async，await使用方法请另行参考大佬博客
https://blog.csdn.net/qq_42941302/article/details/109245356