【vue项目问题解决】跳转新路由，滚动距离不变问题

记录在项目开发过程中遇到的小问题，欢迎大家一起留言探讨

问题

在一个页面中改变scrollTop，再跳转新路由的时候，发现这个滚动距离依旧在

预期结果

在一个页面中改变scrollTop，再跳转新路由的时候，滚动距离变为0

编码实现

在App.vue中监听路由变化

export default {
  watch: {
    $route() {
      // 路由变化的时候，让滚动数据变为0
      document.body.scrollTop = 0
      document.documentElement.scrollTop = 0
    },
  },
};

项目重启，即可达到预期效果。