vue緩存頁面返回到指定滾動位置


vue 中注冊滾動事件與dom 並無不同

以下配合keep-alive 組件使用

在 mounted 注冊滾動事件 

this.handleScroll 獲取scrollTop
mounted(){
  window.addEventListener('scroll', this.handleScroll);
}

  

handleScroll () {
  let scrollTop = document.body.scrollTop;
  this.scroll = scrollTop;
}

keep-alive 組件激活時調用。該鈎子在服務器端渲染期間不被調用。

activated() {
    if(this.scroll > 0){
       window.scrollTo(0, this.scroll);
       this.scroll = 0;
       window.addEventListener('scroll', this.handleScroll);
    }
}

keep-alive 組件停用時調用。該鈎子在服務器端渲染期間不被調用。

deactivated(){
     window.removeEventListener('scroll', this.handleScroll);
}

 參考地址:  VUE


免責聲明!

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



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