前端-promise的使用

案例

var resdata = [
  { name: '平湖市', value: '330482000000' },
  { name: '嘉善县', value: '330421000000' },
  { name: '秀洲区', value: '330411000000' },
  { name: '南湖区', value: '330402000000' },
  { name: '桐乡市', value: '330483000000' },
  { name: '海宁市', value: '330481000000' },
  { name: '海盐县', value: '330424000000' }
];

      resdata.map((item, index) => {
        sysHomepage
          .count({ code: item.value })
          .then((res) => {  //api
            // console.log('regional返回的数据：', res.data.data);
            res.data.data.name = resdata[index].name;
            regional.push(res.data.data);
          })
            console.log('regional：', regional);
            this.initCharts();//渲染地图
      });

页面显示：

此时共绘制了7次地图，然后使用promise：

    let P = new Promise((resolve, reject) => {
        resdata.map((item, index) => {
          sysHomepage.count({ code: item.value }).then((res) => {
            // console.log('regional返回的数据：', res.data.data);
            res.data.data.name = resdata[index].name;
            regional.push(res.data.data);
            console.log('regional', regional);
            if (index == 6) {
              resolve('完成');  //代码正常执行（会调用.then()函数）,当异步代码失败时就会调用reject(...)
            }
          });
        });
      });
      P.then((value) => {
        this.initCharts();
      });

调完api后，才渲染一次。

标签：name,res,前端,regional,resdata,value,promise,使用,data
来源： https://blog.csdn.net/lkkkkkk123456/article/details/121439868