Vue中ECharts在Element UI Tab切换时显示异常，如何解决？

本文共计803个文字，预计阅读时间需要4分钟。

最近在项目中遇到了这种情况，需要在tab控件上渲染多个echart图表，然后切换查看时，发现图表的宽度不准确。原因是在页面加载时，隐藏的图表找不到对应的div大小，导致默认宽度不正确。

最近在项目中遇到了这种情况，需要在tab控件上渲染多个echart图标，然后切换查看时，发现图表的宽度不正确

原因：在页面进行加载时，隐藏的图表找不到对应的div大小，所以默认给了一个大小。所以要做的就是在页面加载时，就对图表进行初始化。

网上的解决方案大多都是监听tab的切换事件，然后再根据切换的页面重新渲染echart组件，比较麻烦。