vue中关于$refs获取子组件的DOM节点方法

目标是做一个向下滚动时到底自动加载的table效果。
先放实现的效果。

我就这么一点一点找的。不过也还好，找到了，就是在$el下面。那么我就可以找到我想要的目标节点了，接下来的问题就简单了，直接贴上代码吧。

    scroll(){
      setTimeout(() => {
        this.box = this.$refs.dataTable.$el.children[2];
        console.log(this.$refs.dataTable)
        this.box.addEventListener('scroll', () => {
          
          const clientHeight = this.box.clientHeight;
          const scrollTop = this.box.scrollTop;
          const scrollHeight = this.box.scrollHeight;
          if (clientHeight >= scrollHeight - (scrollTop + 30) && !this.dataLoading) {
            console.log('到底了')
            this.dataLoading = true;
            setTimeout(() => {
              this.tableData.push({dataDate:'2019 10-11 23:23:25', measureSeconds:'58s'},{dataDate:'2019 10-11 23:23:25', measureSeconds:'58s'},{dataDate:'2019 10-11 23:23:25', measureSeconds:'58s'},{dataDate:'2019 10-11 23:23:25', measureSeconds:'58s'},{dataDate:'2019 10-11 23:23:25', measureSeconds:'58s'})
              this.dataLoading = false;
            }, 1000);
          }
        }, false);
      }, 500);
    }