vue router 如何在返回的时候保存滚动高度？

Question

list.vue和detail.vue，微信浏览器内点击list后打开detail，然后按“返回”，list页都回到顶端，无法保存点击之前的高度。
尝试一下办法
1、用keep-alive，因为返回时list内容有更新，所以没有使用，但是尝试过也无效。
2、用scrollBehavior：设置router的mode:history，打开history模式，但是savedPosition始终都是{x:0,y:0}.
3、尝试以下思路：在跳转到detail之前，获取滚动高度scrollTop，保存该高度，从detail回list的时候再设置滚动高度。现在遇到了一个问题，就是怎么样也获取不到scrollTop。

调试窗口里显示

在list的mountd里添加如下代码

var dom = document.querySelector('#wk_list')
dom.addEventListener('scroll', function () {
    console.log(this.scrollTop)
}, false)

观察scroll方法，应已添加成功

可是就是无法触发事件，获取滚动高度值，dom.scrollTop始终为0，这是为什么啊？或者还有什么办法可以保存滚动高度的？
谢谢！！！

Answer 1

我找到问题原因了，用了vux里面的viewbox的组件了，需要用专门的方法getScrollTop去获取scrollTop.

Answer 2

这个事件绑定放到 mounted 里面才可以触发。

Answer 3

keep-alive需要和scrollBehavior配合一起使用

var router = new VueRouter({
  mode: 'history', //html5模式 去掉锚点
  routes: RouteConf.route,
  scrollBehavior(to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition
    } else {
      return {
        x: 0,
        y: 0
      }
    }
  }
});

数据不刷新的问题可以使用activated和deactivated这两个钩子来触发
如果不使用keep-alive&scrollBehavior，可以使用window.pageXOffset&window.pageYOffset来获取页面的滚动高度在路由变化前

  watch: {
    '$route' (to, from) {
      const _this = this;
      if (from.name === 'index' && to.name !== 'index') {
        let positionStore = {
          x: window.pageXOffset,
          y: window.pageYOffset
        };
        sessionStorage.setItem('indexScrollTop', JSON.stringify(positionStore));
      }
    }
  }