在使用echats的时候,当一张chart1处于未被选中的tab2里面的,然后切换到tab2时,发现chart1的width只有100px。
原因分析:在页面进行加载时,隐藏的图表找不到对应的div大小,所以默认给了一个大小。所以要做的就是在页面加载时,就对图表进行初始化。
解决方法:监听tab的切换,利用v-if属性,当切换至对应的tab时,设置其v-if的值为true即可
这里监听iview传进来的tabValue,由于存在vue的异步更新机制,所以使用$nexttick来更新配置。
@Watch("tabValue")
public onTabChange(newValue: any, oldValue: any) {
this.showChart=false;
this.$nextTick(()=>{
this.showChart=true;
this.$nextTick(()=>{
this.initChart();
})
});
}