错误原因分析:
1、html 元素还没加载或者代码还没有执行完就先执行了 echarts 的渲染,也就是代码执行前后顺序的问题。
2、初始化 echarts 的 DOM 元素不存在。
方法:
确定vue页面是否存在此HTML元素,那么在 实例化echarts前 打印一下看看
console.log(document.getElementById('tongji'))
若为null,则说明DOM元素不存在
//1、添加this.$nextTick(function(){})函数,将表格初始化放到这个函数中就能解决问题 this.$nextTick(function(){ // 2、基于准备好的dom,初始化echarts实例 console.log(document.getElementById('tongji')) this.linebar = echarts.init(document.getElementById('tongji')) this.linebar.setOption(option) })