项目中报错Cannot read property 'getAttribute' of undefined解决

转载于 2019-02-22 11:50:00 发布 · 1.3w 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

原文链接：http://www.cnblogs.com/wangdashi/p/10417524.html

标签

#javascript #ViewUI

本文详细介绍了在Vue项目中使用ECharts图表时，由于图表自适应设置不当，在路由切换时出现的一系列错误。文章深入分析了问题根源，并提供了具体的解决方案，即在组件销毁时移除窗口大小变化的监听事件。

项目中用到了echarts图表

每次切换路由的时候，控制台就会报一堆错误：Cannot read property 'getAttribute' of undefine

经验证，发现是设置了图表自适应导致的,

有多个图表，然后使用是 addEventListener来进行图表自适应，但是在离开当前页的时候，没有清除，就导致了上面的报错

mounted () {
    window.addEventListener('resize', this.initEchart, 20)
    this._getLibraryNumber()
  },
methods: {
    // echarts自适应
    initEchart () {
      this.echart = echarts.init(this.$refs.echart)
      this.echart.resize()
    },
}

了解到原因后，当离开页面的时候，进行清除就可以了

destroyed () {
    window.removeEventListener('resize', this.initEchart, 20)
  },

转载于:https://www.cnblogs.com/wangdashi/p/10417524.html