切换页面保存页面原有的位置信息keep-alive savedPosition meta

1 只有在mode:'history'模式生效；savedPosition，这个功能只在支持history.pushState额浏览器中可用。（通过浏览器的前进/后退 按钮触发）

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

2 切换菜单过程中保留原页面的位置信息， 结合keep-alive和路由元信息

 <keep-alive>   // 缓存组件跳转的页面
 　　<router-view v-if="$route.meta.keepAlive" class="ui-view"></router-view>
 </keep-alive>  
  // 非缓存组件跳转页面
 <router-view v-if="!$route.meta.keepAlive" class="ui-view" ></router-view>
路由元信息中保存页面的滚动信息
new Router({
scrollBehavior: (to, from, savedPosition) {
     if (savedPosition) {
            return savedPosition
    } else {
        if (from.meta.keepAlive) {
        　　from.meta.savedPosition = document.documentElement.scrollTop||document.body.scrollTop;
        }
        return { x: 0, y: to.meta.savedPosition ||0}
    }
}
})
//如果设置页面动效有可能会影响效果；

第三种方法：在单个页面中定义字段记录页面的滚动距离

(1). 在data中定义一个初始值 scroll

(2). 在mouted中 ，mouted中的方法代表dom已经加载完毕

window.addEventListener('scroll', this.handleScroll);

(3).methods 用于存放页面函数

handleScroll () {
       this.scroll  = document.documentElement && document.documentElement.scrollTop
       console.log(this.scroll)
}    

4.activated 为keep-alive加载时调用

activated() {
    if(this.scroll > 0){
        window.scrollTo(0, this.scroll);
        this.scroll = 0;
        window.addEventListener('scroll', this.handleScroll);
     }
}

5.deactivated 页面退出时关闭事件 防止其他页面出现问题

deactivated(){
     window.removeEventListener('scroll', this.handleScroll);
}

参考文档：
1 https://www.cnblogs.com/linjiangxian/p/11457548.html#_label0
2 https://www.cnblogs.com/goloving/p/9211233.html
3 https://github.com/vuejs/vue-router/blob/dev/examples/scroll-behavior/app.js