vue中监听滑动(并解决滑动scrollTop一直为0问题)
一、代码实现1、监听整个窗口(window)的滑动在mounted钩子函数里添加:mounted() {window.addEventListener('scroll',this.handleScroll,true)}然后在methods里创建绑定的方法:methods: {handleScroll(){let scrollTop = document.documentElement.scroll
·
一、代码实现
1、监听整个窗口(window)的滑动
在mounted钩子函数里添加:
mounted() {
window.addEventListener('scroll',this.handleScroll,true)
}
然后在methods里创建绑定的方法:
methods: {
handleScroll(){
let scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
console.log(scrollTop);
}
}
2、监听元素的滑动
同理:
mounted() {
document.querySelector("#id").addEventListener('scroll',this.handleScroll)
}
methods: {
handleScroll(){
let scrollTop = document.querySelector("#id").scrollTop;
console.log(scrollTop);
}
}
二、解决可能出现的document.body.scrollTop一直为0的问题
检查对应元素是否设置了overflow: scroll/auto、高度100%固定之类的样式,有的话更改样式就可以了。
更多推荐
已为社区贡献19条内容
所有评论(0)