前言

      当数据量比较大的时候想要展示更多数据，分页有时候并不能满足要求，表格无限滚动就可以实现。想要实现表格数据的无限滚动需要通过以下步骤来完成：

1、获取表格数据实际展示的DOM；

const tableDom = document.querySelector(".el-scrollbar__wrap");

2、监听滚动事件,通过判断滚动高度/可视区的高度/滚动条的总高度去实现滚动条到底后每次新增获取50条；

const tableScrollFn = () => {
    tableDom?.addEventListener("scroll", () => {
        // 滚动距离
        let scrollTop = tableDom ? tableDom.scrollTop : 0;
        // 可视区的高度
        let windowHeight = tableDom ? tableDom.clientHeight : 0;
        // 滚动条的总高度
        let scrollHeight = tableDom ? tableDom.scrollHeight : 0;
        if (scrollTop + windowHeight === scrollHeight) {
            if (Math.ceil(totalNum.value / 50) == currentPage.value) {
                return;
            }
            if (scrollTop != 0) {
                currentPage.value++;
                getAllocationInfo().then(() => {
                    nextTick(() => {
                        tableDom?.scrollTo({ top: scrollHeight - 574 });
                    });
                });
            }
        }
    });
};