vue 鼠标滚动事件处理定位问题

124 阅读 0 评论 82 点赞

我是靠谱客的博主无限自行车，这篇文章主要介绍vue 鼠标滚动事件处理定位问题，现在分享给大家，希望可以做个参考。

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
methods: {
handleScroll(e) {
const scrollTop = e.target.scrollTop
const scrollWrap = document.getElementById('scroll-wrap')
const offsetTop = scrollWrap.offsetTop
if (scrollTop > offsetTop) {
// 滚动值大于偏移值
scrollWrap.style.position = 'fixed'
// 鼠标滚动到一定距离实现定位
} else {
scrollWrap.style.position = 'static'
}
}
}
mounted() {
// 滚动监听事件
window.addEventListener('scroll', this.handleScroll, true)
},
beforeDestroy() {
// 离开该页面需要移除监听的事件
window.removeEventListener('scroll', this.scrollToTop, true)
}