记录el-tab-pane和 echart 宽度100px的问题

el-tabs展示echarts图表时，echarts除了默认选中页，其他页宽都会变成100px。echarts无法获取到父元素宽，所以默认100%

给echart加v-if

        <el-tabs v-model="activeName">
          <el-tab-pane label="用户管理" name="first">
            <my-chart
              v-if="activeName == 'first'"
              ref="myChartCon"
              v-on:showQcImageFlagChange="showQcImageFlagChange()"
              v-on:qcDataPdfUrlChange="qcDataPdfUrlChange(data)"
              :beizhu="beizhu"
              :queryParams="queryParams"
            >
            </my-chart>
          </el-tab-pane>
        </el-tabs>

watch监听activeName的变化，判断是不是选中了图表那个tab

import myChart from "./controlChart.vue";
export default {
 components: {myChart },
  watch:{
      activeName(val){
        if(val == 'first' ){
          this.$nextTick(()=>{
            this.createEchar()
          })
        }
      }
  },
  data() {
    return {
      activeName: '',
      }
  }
}

子组件的createEchart就是图表的创建，data是传给子组件的数据，这些不重要，主要是判断是不是选中了图表那个tab

 createEchar(data) {
      if (this.activeName == "first") {
        this.$refs.myChartCon.createEchart(data);
      }
 },

然后图表就正常显示啦