关于vue路由跳转之后页面不会到最顶部的问题

在官网的vue-router中提供了scrollBehavior 的方法
scrollBehavior 方法接收 to 和 from 路由对象。第三个参数 savedPosition 当且仅当 popstate 导航 (通过浏览器的 前进/后退 按钮触发) 时才可用。

https://router.vuejs.org/zh/guide/advanced/scroll-behavior.html
这是官网提供的文档,有兴趣的可以点进去看下

具体的实现方法如下

const router = new VueRouter({
  mode: 'history',
  routes: routes,
  scrollBehavior (to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition
    } else {
      return { x: 0, y: 0 }
    }
  }
})

这里的判断主要是判断页面是否发生了滚动如果滚动了就 回到顶部

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容