迫于实现一个 infiniteScroll 组件，求提供思路

[molvqingtai]

我遇到这么个问题哪位大佬提供下思路
我写了一个 infiniteScroll 组件，通过监听滚动条实现，传入两个 props，一个是控制是否禁用加载的 Boolean 变量，一个是触底后要执行的 function，，现在效果是实现了，但是当手动更改数据后（排序），pageSize 不够撑满 html 的情况下，因为没有滚动条，就不会触发滚动事件
我想实现的效果是 infiniteScroll 和父组件解耦和 data 的数据无关，只要触底就加载，但是因为 pageSize 的问题我还需要传入第三个 props 做判断，大佬们提供下思路

就几行代码

[tinytin]

用 getBoundingClientRect

[mmmfj]

这个代码图片是怎么生成的

[molvqingtai]

@mmmfj 一个插件 Carbon

[edwardwo]

listEle.addEventListener('wheel', this.infiniteScroll)
用'wheel' event, 不要用 scroll, scroll 必须有滚动条时才触发. 'wheel' 一滚动, 就触发. 在 infiniteScroll 中再判断:

scrollHeight = listEle.scrollHeight
scrollTop = listEle.scrollTop
offsetHeight = listEle.offsetHeight

if (scrollHeight === scrollTop + offsetHeight) {
this.$emit('loadMore')
}

[molvqingtai]

@edwardwo 问题解决了，感谢大佬！