解决echarts图表在tabs中被压缩的问题

问题

如果在你的项目内有Tabs,并且在待点击的Tab下有echarts图表。点击此tab后可能会出现如下的情况：（图表被压缩）

解决

问题来源： 其实这个Tab下的内容在刚进入这个url时（点击这个tab前）已经被渲染好了，在你点击tab展开内容时就发生了这样的格式问题。
解决思路：

1. 重新布局图表（让压缩的图表重新展开一下）。使用API：myChart.resize()，至于这个语句放到哪里，就看开发者自己了。有人放在定时器里，也有人放在点击事件里面。
2. 延迟渲染：等点击Tab后再渲染图表。个人觉得是最方便、简单的办法（我用的Element组件库）。查看官方文档可以发现：
   所以只需在原有的基础上，让lazy属性为true即可。
   注：
   尝试过很多方法，效果都不是很好，最后采用的2方法，还是看官方文档有用。
   项目前后端分离，前端用的Vue+Element。bootstrap的tab和echarts图表也会产生一样的问题，相信也有类似延迟渲染的办法。