[Vue warn]: Error in mounted hook: "TypeError: Cannot read property 'getAttribute' of null"

在运行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);