vue中tab页签切换导致echarts被压缩的问题

问题描述

vue中使用tab进行页签切换，echarts图表的宽度设为100%的情况下，图表出现压缩变形的情况。

---

解决方案：

1. 设置静态的宽度

 使用vm单位来设置宽度

vm与“%”的区别：
 两个效果大致相同。

• ‘%’：对于父元素
• ‘vm’：对于浏览器

2. v-if

 利用v-if值切换来重绘图形页面。

	<van-tabs
          v-model="active"
          title-active-color="#303135"
          title-inactive-color="#8d8e90"    
        >
          <van-tab title="国资口径" name="state">
            <Artificial v-if="active == 'state' "/>
          </van-tab>
          <van-tab title="管理口径" name="management">
            <Artificial v-if="active == 'management'" />
          </van-tab>
        </van-tabs>