第一步data定义初始值
data() {
return {
index: 0,
}
},
第二步自定义函数定义该函数
methods: {
sorlly() {
let scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
// 可视区域
let clientHeight = document.documentElement.clientHeight;
// 页面的高度
let scrollHeight = document.documentElement.scrollHeight;
//如果触底就让index++
if (scrollTop + clientHeight >= scrollHeight) {
this.index++;
}
}
}
第三步在监听sorlly函数
created() {
window.addEventListener('scroll', this.sorlly)
},
第四步监听index的变化调用函数
watch: {
index() {
//调用函数重新拉取数据
this.getList()
}
}
最后可以在路由跳转的时候销毁监听事件
beforeUnmount() {
// 移除事件监听
window.removeEventListener('scroll', this.sorlly)
},