Vue通过this.$refs无法获取DOM

1、在一个页面点击显示弹窗的时候，无法用this.$refs获取到DOM，但在父页面是可以得到的

<div :style="{border:'1px solid #DDDDDD',width: '100%',height:'400px',}" ref="myChartModal"></div>

let myChartModal = this.$echarts.init(this.$refs.myChartModal);

报错：

原因：看了一些博客，是“因为ref本身是作为渲染结果被创建的，在渲染的时候是不能访问的，因为他们还不存在。$refs不是响应式的，只在组件渲染完成后才填充”，所以可以在DOM渲染完毕后再进行获取：通过添加this.$nextTick()来实现，this.$nextTick()将回调延迟到下次 DOM 更新循环之后执行：

<div :style="{border:'1px solid #DDDDDD',width: '100%',height:'400px',}" ref="myChartModal"></div>

this.$nextTick(() => {
          let myChartModal = this.$echarts.init(this.$refs.myChartModal);
        });