解决el-dialog中使用echarts加载不出图表

HTML：

<template>
  <el-dialog
    :visible.sync="openGantt"
    width="1200px"
    :append-to-body="true"
    destroy-on-close
    @open="openFun()"
    @close="cancel"
  >
    <div
      id="popupGanttDispatchControl"
      :style="{ height: height, width: width }"
    />
  </el-dialog>
</template>

SCRIPT：

使用 this.$nextTick 方法解决

import echarts from "echarts";
export default {

  data() {
    return {
      chart: null,
    };
  },
  beforeDestroy() {
    if (!this.chart) {
      return;
    }
    this.chart.dispose();
    this.chart = null;
  },
  openFun() {
    //打开加载图表
    this.$nextTick(() => {
      this.initChart();
    });
  },
  initChart(){
      // ...  
  }
}