vue項目中實時監測瀏覽器滾動條的高度

1、在mounted生命周期函數注冊滾動條事件

 

mounted() {
  window.addEventListener('scroll', this.windowScroll)
}

2、在methods方法里使用

 

methods: {
  windowScroll() {
     // 滾動條距離頁面頂部的距離
     // 以下寫法原生兼容
     let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
      console.log(scrollTop);
  }
}

3、實例銷毀之前，解綁事件

 

  beforeDestroy() {
      window.removeEventListener('scroll', this.windowScroll)
  }