echart 错误:Error in mounted hook: "Error: Initialize failed: invalid dom."

https://img2022.cnblogs.com/blog/2833653/202207/2833653-20220714143415544-1563086352.png

  • 原因:初始化没有获取到元素

  • 方法:初始化的时候,使用$nextTick延后执行

      mounted() {
        this.init();
      },
      methods: {
        init() {
          this.$nextTick(() => {
            this.initPic();
          });
        },
    
        initPic() {
          const chartDom = this.$refs.echartPicRef;
          const myChart = echarts.init(chartDom);
          const option = {
            xAxis: {
              type: "category",
              data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
            },
            yAxis: {
              type: "value",
            },
            series: [
              {
                data: [150, 230, 224, 218, 135, 147, 260],
                type: "line",
              },
            ],
          };
    
          option && myChart.setOption(option);
        },
    }
    
posted @ 2022-07-14 14:36  DL·Coder  阅读(5949)  评论(0编辑  收藏  举报