分页加载 加载完成逻辑_一种TreeView组件分页异步加载的方法

笔者在工作中遇到了一个web环境需要展示100w级目录节点treeview的需求，本文重点介绍笔者设计的一种treeView分页的方法。

1、无限滚动长列表

前端的业务开发中会遇到数量很大的列表展示情况，一般的处理方法是使用某种方法分屏分页的加载数据。

通常的做法是检测是否滚动到底，然后进行网络请求操作。

const maxScrollTop = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight) - window.innerHeight;const currentScrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);if (maxScrollTop - currentScrollTop < 20) {
      //… getNext}

一般情况下，这种方法已经够用。

但是，万一，列表的每一项结构复杂，用户又有可能上下滚动一整天呢？

我们来稍微测试下：

 let start = new Date(); let imgUrl = 'http://127.0.0.1/profile.jpg'; let containerDom = document.getElementById('container'); cons