echarts图表报错 Error in created hook: “Error: Initialize failed: invalid dom.“

报错原因：

dom还没挂载完成，echarts.init() 就已经开始执行

即

let myChart3 = this.$echarts.init(document.getElementById("myChart3"));

放在入了页面加载事件created里面，created这时候还只是创建了实例，但模板还没挂载完成

解决方法：

• created:在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图
• mounted:在模板渲染成html后调用，通常是初始化页面完成后，再对html的dom节点进行一些需要的操作

使用create情况下使用延迟加载

（1）setTimeout延迟加载

setTimeout（）方法用于在指定毫秒数后调用

通过延迟加载getChart（）方法，使DOM先于getChart方法加载，为DOM加载提供时间

（2）使用nextTick延迟加载

1 2 3 4 5

created() {   this.$nextTick(()=>{     this.getchart();   }) },

（3）用mounted还是会报错

把

let myChart3 = this.$echarts.init(document.getElementById("myChart3"));

替换成试一下

let myChart=echarts.init(this.$refs.Echarts)