关于 addEventListener 和 scrollTop 的问题

来源:9-3 Vue项目详情页 - 实现Header渐隐渐显效果

谭轲

2019-04-22

做项目时发现:
window.addEventListener('scroll', this.handleScroll)
添加滚动事件后,滚动无法触发 handleScroll 函数,需要添加第三个参数才可以触发:
window.addEventListener('scroll', this.handleScroll, true)
上网查过后发现第三个参数是关于冒泡和捕获的,也就是说必须要设置为捕获才能监听到 scroll 事件,这是为什么呢?

还有就是关于 scrollTop 问题,我设置了
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
但是在滚动过程中这个 scrollTop 始终为 0,上网查过后发现随滚动变化的是 this.$root.$el.scrollTop 的值,这又是为什么呢?

写回答

1回答

Dell

2019-04-22

第二个问题是因为document.body.scrollTop 肯定是0,要换成哪个在body里滚动的元素的scrollTop才可以

0
0

Vue2.5-2.6-3.0开发去哪儿网App 零基础入门到实战

课程紧跟Vue3版本迭代,企业主流版本Vue2+Vue3全掌握

10675 学习 · 8191 问题

查看课程