vue项目：echarts数据更新，但是没有重新绘制的问题

问题复现：我封装了一个a组件，组件内包含了echarts图标，我把组件放到了home页面中，home页面在打开的时候会请求数据，处理完后通过组件通讯（父传子），把数据传给a组件，这样就产生了一个问题，请求是异步的，echarts会先用props中的默认数据直接渲染

最后解决方法

通过watch监听父组件传来的数据

export default {  
  props: {
    chartData: {
      type: Array,
      default: () => [],
    },
  },
watch: {
    chartData: {
      handler(newVal) {
        if (this.chart) {
          this.chart.setOption({
            // 更新图表的配置，使用新的数据
            series: [
              {
                data: newVal,
              },
            ],
          });
        } else {
          // 初始化图表
          this.chart = this.$echarts.init(this.$refs.echartsContainer);
          this.chart.setOption({
            // 初始图表的配置，使用初始数据
            series: [
              {
                data: this.AlertAllSections,
              },
            ],
          });
        }
      },
      deep: true,
    },
  },
}