vue中監聽頁面滾動和監聽某元素滾動


①監聽頁面滾動

在生命周期mounted中進行監聽滾動:

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

在方法中定義監聽滾動執行的方法:

scrollToTop() { 
    var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
    console.log(scrollTop) 
},

 ②監聽某元素滾動

tips:需要監聽的這個元素需要擁有固定的高度

vue組件中:

<div class="read-con"  @scroll="scrollEvent" >
</div>

 在方法中定義scrolldiv,是監聽class為read-con滾動以后需要執行的方法

scrollEvent () {
      let _this = this
      let read = _this.$el.querySelector('#read')
      console.log(read.scrollToTop)
},

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM