03的开发日志
0%

Vuepress使用vue-router切换页面时总是滚动到顶部

发表于 更新于 分类于
本文字数： 693 阅读时长 ≈ 1 分钟
  1. 解决方案

解决方案

参考资料：

打开node_modules\@vuepress\core\lib\client\app.js，在里面找到 vue-router 实例的创建语句：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
const router = new Router({
  base: routerBase,
  mode: 'history',
  fallback: false,
  routes,
  scrollBehavior (to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition
    } else if (to.hash) {
      if (Vue.$vuepress.$get('disableScrollBehavior')) {
        return false
      }
      return {
        selector: to.hash
      }
    } else {
      return { x: 0, y: 0 }
    }
  }
})

把 scrollBehavior 删掉，保存并重新编译

1
2
3
4
5
6
const router = new Router({
  base: routerBase,
  mode: 'history',
  fallback: false,
  routes
})

此时，用 $router.push() 跳转页面时，滚动条将保持原来的位置不动。