关于使用Echarts进行数组遍历

不多说，直接挂代码

draw_pieChart() {
      var pieChart = echarts.init(this.$refs.pieChart);
      var resArray = [];
      axios
        .get(
          "https://mock.mengxuegu.com/mock/642f630132affa39a121cd8d/example/CtssProAnalysis"
        )
        .then((res) => {
          for (var i = 0; i < res.data.data.length; i++) {
            resArray.push({
              value: res.data.data[i].issueNum,
              name: res.data.data[i].projectName,
            });
          }
          console.log(resArray);

          //软件品牌月度问题统计..饼图
          let pieOption = {
            title: {
              text: "软件品牌月度问题统计",
              left: "center",
              top: "10%",
            },
            tooltip: {
              trigger: "item",
            },
            legend: {
              orient: "horizontal",
              bottom: "left",
            },
            series: [
              {
                type: "pie",
                radius: "50%",
                data: resArray,
                emphasis: {
                  itemStyle: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: "rgba(0, 0, 0, 0.5)",
                  },
                },
              },
            ],
          };
          pieChart.setOption(pieOption);
        });
    },

思路：

axios.get方法获取伪数据库数据，获取到数组。

定义一个resArray的空数组，

使用for循环，遍历数组数据，并push到resArray中。

注意！！

不可以在Echarts的data中这样定义：data:[res.data.....]或者data:[resArray]

目前尝试过了很多错误，大多都会报Error，但是并不返回原因；到头来想必就是Echarts组件的渲染错误。

resArray.push({
              value: res.data.data[i].issueNum,
              name: res.data.data[i].projectName,
            });

这一步很关键。因为Echarts的data中，带有value和name，所以这样存储，更符合Echarts的显示规律。如此，resArray数组就设置好了，直接让 data:resArray ， 就可以了

实际resArray存储的数据，就是[{value：XXX，name:''XXX''},{value:XXX,name:"xxx"}]