解决Uncaught TypeError: Cannot read properties of null (reading ‘getAttribute‘)-编程知识

解决Uncaught TypeError: Cannot read properties of null (reading ‘getAttribute‘)

问题：用了element ui 的echart ,初始化时候找不到指定id的元素，导致的问题，如下

浏览器控制台输出的错误信息如下

Echars

echarts.min.js:22 Uncaught TypeError: Cannot read properties of null (reading 'getAttribute')at echarts.min.js:22:210725at Yd (echarts.min.js:22:210761)at t.init (echarts.min.js:22:748697)at Object.success (click_menu.html:1967:43)at k (jquery-1.8.2.min.js:2:16920)at Object.fireWith [as resolveWith] (jquery-1.8.2.min.js:2:17707)at y (jquery-1.8.2.min.js:2:80804)at XMLHttpRequest.d (jquery-1.8.2.min.js:2:86374)

问题页面展示

分析：

通过断点发现如下代码执行被卡顿，正常情况这段代码应该正常执行

var myChart = echarts.init(document.getElementById('echarts01'));

后来发现，页面刷新后，通过按钮刷新echarts的数据，图标正常显示

那么可以通过控制将页面加载完成再执行这段代码那

所以开始尝试了一下两种都不行

mounted() {
this.chartPort();
},

和

this.$nextTick(() => {})

最终办法

mounted() {
var that = this;//防止this指向问题
var timer = setInterval(function () {
// 判断页面所有资源已加载完毕
if (document.readyState === "complete") {
that.initMyEcharts();//这里去调用你初始化echarts 的方法
window.clearInterval(timer);
}
}, 1000);
},

问题得到解决