Echarts图表初次加载时，显示不全

首先，我这里设置的width="100%"，首次加载当前页会出现，图表超出容器的现象：

但是，刷新一下或者按下F12弹出控制台就恢复了；why????????????

1.起初想从width入手进行分析，给echart组件增加div包裹或者添加内部的padding，无果；

2.鉴于echart的自带resize方法，这也是为啥刷新和F12都能触发恢复的原因；
解决：于是，在echart引入的当前页面，手动来触发一下window.resize()就完美解决了这个问题，

const myEvent = new Event("resize");
window.dispatchEvent(myEvent);

前提是你的echart封装组件中也监听了resize

mounted() {
  // this.myChart = echarts.init(this.$el);
  this.draw();
  window.addEventListener("resize", this.handleWindowResize);
},
methods: {
  handleWindowResize() {
    this.myChart && this.myChart.resize();
  }
},

 

就这样，撤退~