瀏覽器記住滾動位置，返回頁面時滾動到該位置

const recordHistoryPosition = () => {

  if (window.history.replaceState) {

    const state = {

      __scrollX: window.scrollX,

      __scrollY: window.scrollY,

    }

 

    window.history.replaceState(state, '')    // 第二個參數是頁面 url，缺省值爲當前頁面

  }

}

 

const scrollToHistoryPosition = () => {

  const state = window.history.state

 

  if (state &&

    Number.isFinite(state.__scrollX) &&

    Number.isFinite(state.__scrollY)) {

    window.scrollTo(state.__scrollX, state.__scrollY)

  }

}

 

const clearHistoryPosition = () => {

  const state = window.history.state

 

  if (state && window.history.replaceState) {

    window.history.replaceState(null, '')

  }

}

 

module.exports = {

  recordHistoryPosition,

  scrollToHistoryPosition,

  clearHistoryPosition,

}

 

注：

　　1. 跳轉頁面時調用 recordHistoryPosition，以記錄當前瀏覽位置；

　　2. 在跳轉回來時，數據加載完成後調用 scrollToHistoryPosition（必定要等到數據加載完再調用）；

　　3. 在 scrollToHistoryPosition 下方加上 setTimeout(() => clearHistoryPosition(), 100)。