【echarts】Can‘t get DOM width or height. Please check dom.clientWidth and dom.clientHeight.

错误

Can't get DOM width or height. Please check dom.clientWidth and dom.clientHeight. They should not be 0.For example, you may need to call this in the callback of window.onload.

错误翻译

无法获取dom的宽高（简单来说就这个几个字）
翻译：无法获取DOM的宽度或高度。请检查dom。clientWidth dom.clientHeight。它们不应该是0。例如，你可能需要在window.onload的回调函数中调用它。

错误情景

笔者问题出现的情景：从其它页面跳转都没问题，可以正常加载展示，唯独一旦刷新浏览器就加载不到了（dom的宽高都已设置）。通过查资料研究发现出现问题是地方是“浏览器刷新后，页面是需要重新加载渲染，而在加载还未完成时，echarts图函数被已加载，页面还没渲染结束，肯定就获取不到DOM的宽高啦”

错误解决方法

解决方法：笔者是在mounted() 中借助setTimeout()来延迟加载。
也可以利用vue生命周期函数来避免该问题的发生

mounted() {
        setTimeout(() => {
            this.get_echarts_1();
            this.get_echarts_2();
        }, 800)
    },

重点：一定要在DOM渲染结束后，再去加载

附加扩展

Vue 生命周期