echarts之Error: Initialize failed: invalid dom.-CFANZ编程社区

echarts之Error: Initialize failed: invalid dom.

问题截图：
产生原因：进入图表页后调用获取图表数据接口，接口未返回数据时就跳离图表页，而后数据返回并创建图表，但跳离了图表页就获取不到容器元素，因此报错并且创建图表失败。
解决方案：
1. 不使用原生js方法获取容器元素（例如：document.getElementById()），改用this.$refs。
2. 如果图表页是缓存页，并希望跳回图表页后图表能加载好，则需要在图表容器的行内样式中写好容器的宽高（以px为单位）。（对于缓存页也提供另外一种解决思路：在组件的activated生命周期执行创建图表方法）

示例代码：

<div ref="chinaMapChart" style="width: 770px; height: 560px" />

--- 分割线 ---

const myChart = echarts.init(this.$refs.chinaMapChart)

0 条评论