Vue.js动态路由间切换回到顶部

方案1

使用官方的滚动行为，但是必须开启HTML5 history 模式，开启HTML5 history 模式需要后端进行一些配置；

对于所有路由导航，简单地让页面滚动到顶部：

scrollBehavior (to, from, savedPosition) {
  return { x: 0, y: 0 }
}

像浏览器的原生表现那样：

scrollBehavior (to, from, savedPosition) {
  if (savedPosition) {
    return savedPosition
  } else {
    return { x: 0, y: 0 }
  }
}

方案2

没有使用HTML5 history 模式，需要使用官方的导航守卫中的router.beforeEach：

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

原文链接：https://wangdaodao.com/20180103/vue-router-scrolltop.html