原因

其实是因为echarts会自动继承父级的高度，但是现实隐藏时候display则echarts无法继承父类的宽高

解决方案

for (const [containerId, { option, config }] of this
              .echartsOptions) {
              this.$nextTick(() => {
                let dom = document.getElementById(containerId);
                let { width, height } = dom.getBoundingClientRect();
                let myChart = this.$echarts.init(dom, "light");
                myChart.clear();
                myChart.resize();
                myChart.setOption(option, config);
              });
            }

原理

• myChart.clear();清空画布
• myChart.resize();重置大小

二者配合：如果只是resize则在页面切换时候会有放大缩小的错觉，而clear清空画图，因为画布是空的，自然没有显示隐藏时候放大缩小的感觉