el-tabs切换导致echart图表不展示或者样式错乱

1、对echart组件中，添加window的resize事件，resize事件中，resize事件触发echart的resize事件

mounted() {
  window.addEventListener("resize", this.onResize);
  },
  beforeDestroy() {
    window.removeEventListener("resize", this.onResize);
  },
methods: {
    initChart(data, series) {
      let getchart = this.chart;
      if (this.chart === null) {
        getchart = echarts.init(document.getElementById(this.id));
        this.chart = getchart;
      }

      let option = {
        ...
      };

      getchart.setOption(option);
    },
    onResize() {
      this.chart && this.chart.resize();
    }
  }

2、对el-tabs绑定监听watch事件，当tab修改后（及切换到有echart的页面），手动触发window的resize事件，注意要加上nextTick（保障页面切换过去后）

 <el-tabs v-model="status">
        <el-tab-pane label="重点人" name="key">
          <man-key :deptId="deptId" />
        </el-tab-pane>
        <el-tab-pane label="陌生人" name="stranger">
          <man-stranger :deptId="deptId" />
        </el-tab-pane>
      </el-tabs>

watch: {
    status(val) {
      this.$nextTick(() => {
        const myEvent = document.createEvent("HTMLEvents");
        myEvent.initEvent("resize", false, true);
        window.dispatchEvent(myEvent);
      });
    }
  }