Vue解决echart在element的tab切换时显示不正确（现在已经不能用lazy了）

在tab控件上渲染多个echart图表，然后切换查看时，发现图表的宽度不正确

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

网上真的是太多太多太多坑了，服了，各种能不能用的都不先自己测试一下再贴上去，真心服了这些人。本来element tabs里面有个很好解决的办法就是在tab-pane添加上lazy='true’属性即可，不过现在已经没有这个属性了！没有了！看图，
官方已经把这个属性去掉了，那么现在要怎么修改呢，这里有一个很好办法，亲测绝对有效。

原理：利用v-if属性,当切换至对应的tab时，设置其v-if的值为true即可，同时设置默认显示的tab。

代码如下：

<template>
  <div>
    <el-tabs type="card" v-model="tabItem">
      <el-tab-pane label="第一页" name="tab1">
        <charts v-if="'tab1' === tabItem"></charts>
      </el-tab-pane>