vue 判断组件进入可视区域
1、mounted监听 监听元素是否进入/移出可视区域window.addEventListener("scroll", this.scrollHandle, true); // 监听 监听元素是否进入/移出可视区域2、 methods执行事件scrollHandle() {const offset = this.$el.getBoundingClientRect();const offsetTo
·
1、mounted 监听 监听元素是否进入/移出可视区域
window.addEventListener("scroll", this.scrollHandle, true); // 监听 监听元素是否进入/移出可视区域
2、 methods 执行事件
scrollHandle() {
const offset = this.$el.getBoundingClientRect();
const offsetTop = offset.top;
const offsetBottom = offset.bottom;
// const offsetHeight = offset.height;
// 进入可视区域
// console.log(offsetTop,offsetBottom)
if (offsetTop <= window.innerHeight && offsetBottom >= 0) {
// console.log('进入可视区域');
} else {
// console.log('移出可视区域');
}
}
3、记得在适当的时候移除事件监听
window.removeEventListener('scroll', this.scrollHandle, true);
赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞
更多推荐
已为社区贡献4条内容
所有评论(0)