vue 中判断滚动条滚动方向的方法

data() {
    return {
      beforeScrollTop: 0,
    };
  },


methods: {
  onScroll() {
        let scrollTop = this.$refs.rightContent.scrollTop; 
        let scroll = scrollTop - this.beforeScrollTop; //拿新获取到的网页被卷去的高 初始的值
        this.beforeScrollTop = scrollTop; //上面减完下面把新获取的值给 beforeScrollTop
        // 通过scroll判断 滚动条滚动的方向 
        if (scroll < 0) {
          this.$refs.rightContent.style.height='calc(100vh - 149px)'
          this.$refs.searchcomponents.style.display='block'
        } else {
          this.$refs.rightContent.style.height='100vh'
          this.$refs.searchcomponents.style.display='none'
        }
      },
}

posted @ 2022-03-31 14:15  cx-键盘手  阅读(411)  评论(0)    收藏  举报