Vue+G2:Please specify the container for the chart! + Cannot read property ‘appendChild‘ of null

研究了一下午，终于搞懂了是为啥。

先看一下代码，两个tab标签页，其中一个放chart的挂在节点，但是初始化的时候一直报两个错。

    <a-tabs default-active-key="1" @change="callback">
      <a-tab-pane key="1" tab="预览">
        <a-table
          size="small"
          :pagination="false"
          :scroll="{x: 10000, y: 500}"
          :columns="columns"
          :data-source="data">
        </a-table>
      </a-tab-pane>
      <a-tab-pane key="3" tab="可视化">
        <div id="chartMountNode"></div>
      </a-tab-pane>
    </a-tabs>

      const graphMountNode = document.getElementById("chartMountNode")
      this.chart = new G2.Chart({
        container: graphMountNode,
        width: 600,
        height: 300
      });

Please specify the container for the chart!

这个是因为chartMountNode的div不存在导致的，在G2画图之前div还没有渲染。

但问题是，default-active-key指定的是1，所以3标签页里挂载节点的div还没有渲染，所以，不能放在这里。

TypeError: Cannot read property 'appendChild' of null

      this.chart = new G2.Chart({
        container: "chartMountNode",
        width: 600,
        height: 300
      });

这个不知道是为啥，直接从文档里复制过来的代码结果不能运行，只能用document.getElementById先获取元素。