在运行Vue项目时出现了控制台报错:
[Vue warn]: Error in mounted hook: "TypeError: Cannot read property 'getAttribute' of null"
然后echarts图没有显示。
原因:Echarts的图形容器还未生成就对其进行了初始化所造成的。
解决办法:
利用Vue中的ref和$refs 来代替document.getElementById()获取该图形容器对象。
报错代码如下:
//html
<template>
<div id="main-eChartsAllProducts"></div>
</template>
//js
this.charts = this.$echarts.init(document.getElementById(id));
改完后代码:
//html
<template>
<div id="main-eChartsAllProducts" ref="chart"></div>
</template>
//js
this.charts = this.$echarts.init(this.$refs.chart);