vue中监听页面滚动位置

---

问题描述

页面滚动到指定位置时，展示侧边栏导航。

---

实现代码

1. 获取页面被卷起的高度

使用 e.target.scrollTop可以获取到页面向上滚动了多少像素，代码如下：

showSideNav(e) {if (!!e.target.scrollTop && e.target.scrollTop > 700) {this.isSideNavShow = true;} else {this.isSideNavShow = false;}
},

2. 监听滚动事件

在生命周期监听和移除滚动事件，代码如下：

mounted() {window.addEventListener('scroll', this.showSideNav, true);
},
beforeDestroy() {window.removeEventListener('scroll', this.showSideNav, true);
},