vue 切换页面/路由时保持滚动条在最顶部

我在做PC端vue项目的时候发现,切换页面滚动条的位置并没有改变,因为切换路由实际上并不是切换页面而且改变了页面中的组件,所以滚动条的位置不变,为了获得更好的体验,需要每切换一个新的页面(一个新的路由)时就让滚动条回到最顶部。

代码如下:

// App.vue
export default {
  name: 'App',
  components: {
    MHeader,
    MFooter
  },
  watch:{
    '$route':function(to,from){
     document.body.scrollTop = 0
      document.documentElement.scrollTop = 0
    }
  }

}
    原文作者:Peggy7
    原文地址: https://segmentfault.com/a/1190000017011629
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞