近期在业务中要实现keep-alive记住滚动条位置，发现scrollTop一直为0，排除各个组件的问题后仍未找到解决办法，最后考虑到是css的问题。
mounted() {
//一开始使用的@scroll绑定在container上没有触发，后来发现使用这种方法有效
window.addEventListener('scroll', this.scroll, true)
},
methods: {
//封装的兼容性方法
scroll() {
//获得页面向左、向上卷动的距离
function getScroll() {
return {
left:
window.pageXOffset ||
document.documentElement.scrollLeft ||
document.body.scrollLeft ||
0,
top:
window.pageYOffset ||
document.documentElement.scrollTop ||
document.body.scrollTop ||
0
};
}
//这里的this.$nextTick一定要有
this.$nextTick(() => {
//这里是外层container
const container = this.$el.querySelector('.container')
if (container) {
//正常获取scrollTop
console.log(this.$el.querySelector('.container').scrollTop);
}
})
}
}
.container {
/* 这两个是必须要有的，不要写成overflow-y:auto; */
overflow-y: scroll;
height: 100%;
}
如有不足欢迎指正