解决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:210725
    at 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);
        },

问题得到解决

上一篇:笔记-PPT绘图导出高清无失真图片


下一篇:Hive 移除索引支持的原因