产生问题的原因:
这个问题不是由于 ECharts 不支持 100% 引起的,事实上,ECharts 不管你 CSS 写的是像素值还是百分比,只管实际容器的大小。而在 tab 切换的时候,其实这个容器是 0x0 的,所以再切回这个 tab 的时候当然是需要 resize 一下的。
初始化图表的时候 赋值给变量方便调用方法
this.myChart = echarts.init(document.getElementById(this.chartId));
// tab 切换的时候或者图标展示的时候使用 this.myChart.resize() 重新resize
注:页面dom 没有更新完成后调用this.myChart.resize()无效
this.$nextTick(() => {
this.myChart.resize(); // 在 DOM 更新后调用 resize
});