vue 中监测滚动条加载数据（懒加载数据）
1：钩子函数监听滚动事件：
mounted () {
this.$nextTick(function () {
window.addEventListener('scroll', this.onScroll)
})
},
2：
methods: {
// 获取滚动条当前的位置
getScrollTop () {
var scrollTop = 0
if (document.documentElement && document.documentElement.scrollTop) {
scrollTop = document.documentElement.scrollTop
} else if (document.body) {
scrollTop = document.body.scrollTop
}
return scrollTop
},
// 获取当前可视范围的高度
getClientHeight () {
var clientHeight = 0
if (document.body.clientHeight && document.documentElement.clientHeight) {
clientHeight = Math.min(document.body.clientHeight, document.documentElement.clientHeight)
} else {
clientHeight = Math.max(document.body.clientHeight, document.documentElement.clientHeight)
}
return clientHeight
},
// 获取文档完整的高度
getScrollHeight () {
return Math.max(document.body.scrollHeight, document.documentElement.scrollHeight)
},
// 滚动事件触发下拉加载
onScroll () {
if (this.getScrollHeight() - this.getClientHeight() - this.getScrollTop() <= 0) {
if (this.status === 1) {
this.status = 0
// 页码，分页用，默认第一页
this.deliverParams.page += 1
// 调用请求函数
alert('触发！！！')
}
}
},
}