当一个页面中既有echarts又有Tab标签,且echarts图不止一个时,会出现echarts图被压缩的问题,解决如下,亲测有效:
在引入echarts组件时,添加一个v-if条件,在每次切换到该tab页时,才会加载echarts:
<el-tabs v-model="activeName" @tab-click="handleClick" >
<el-tab-pane label="故障率" name="gzl">
<Echarts1 :queryParamsNew="FaultMonthParams" />
</el-tab-pane>
<el-tab-pane label="缺陷隐患情况" name="qxyh">
<Echarts2 v-if="'qxyh'===activeName"/>
</el-tab-pane>
</el-tabs>
<script>
data(){
return {
activeName: 'gzl'
}
},
methods: {
handleClick(tab,event) {}
</script>