美文网首页VUE相关文章
vue-router scrollBehavior无效问题

vue-router scrollBehavior无效问题

作者: 子心_ | 来源:发表于2019-06-19 11:53 被阅读0次
const router = new VueRouter({
  routes: [...],
  scrollBehavior (to, from, savedPosition) {
    // return 期望滚动到哪个的位置
    scrollBehavior (to, from, savedPosition) {
      if (savedPosition) {
           return savedPosition
      } else {
      return { x: 0, y: 0 }
   }
 }
  }
})

发现添加路由后并没有起作用,查询资料发现
作者在issues中说vue-router不再支持这个特性了。

解决办法:

// main.js中, 全局路由钩子
router.afterEach((to, from) => {
  let bodySrcollTop = document.body.scrollTop
  if (bodySrcollTop !== 0) {
    document.body.scrollTop = 0
    return
  }
  let docSrcollTop = document.documentElement.scrollTop
  if (docSrcollTop !== 0) {
    document.documentElement.scrollTop = 0
  }
})

相关文章

网友评论

    本文标题:vue-router scrollBehavior无效问题

    本文链接:https://www.haomeiwen.com/subject/ccbhqctx.html