关于vue中tab切换时Echarts在第二个页面无法正常显示

       今日在做在某个模块中使用了tab切换来展示不同的数据呈现,结果就出现了问题,第一个页面可以展示,但是在第二个以及之后的页面就不能展示了,经过搜集资料找到的原因:

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

 解决方法1: 如果说对自适应要求不高,可给父元素设置固定的width 和height。

解决方法2: 把 v-show 改成 v-if,v-if的实现是把相应的元素删掉在重新渲染,所以在进入第二个页面的时候就会重新渲染数据表,从而获取到准确的width 和height。 

发布了93 篇原创文章 · 获赞 93 · 访问量 8万+

猜你喜欢

转载自blog.csdn.net/qq_41937388/article/details/103241687