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

问题描述

问 题

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，这是为什么啊？或者还有什么办法可以保存滚动高度的？
谢谢！！！

解决方案

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

这篇关于vue.js - vue router 如何在返回的时候保存滚动高度？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！