vue 移動端項目切換頁面,頁面置頂


之前項目是pc端是使用router的方式實現置頂的

 

//main.js

router.afterEach((to, from, next) => {
  window.scrollTo(0, 0)
})

 

但是改了移動端就沒有效果了,稍微查了一下,好像說是要body里才有用。

可能與我使用了vux-ui有關

在深究router方式還是找新方法的選擇上,我選了后者,

//自定義的common.js

// 這個方法通過遞歸找到滾動的元素,用於置頂頁面
function getScrollParent (node) {
  if (node == null) {
    return null
  }
  if (node.scrollHeight > node.clientHeight) {
    return node
  } else {
    return getScrollParent(node.parentNode)
  }
}

export {getScrollParent}
 

// 頁面文件,例如hello.vue

// 引入
import {isEmptyObj, getScrollParent} from '@/common/utils/common'

//在mounted鈎子函數調用
 mounted () {
    const element = getScrollParent(this.$el)
    element.scrollTop = 0
    this.initCanvas()
  },

用以上方法,解決問題

 


免責聲明!

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



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