1.页面keepAlive
2.滚动的盒子加上overflow:scroll
和-webkit-overflow-scrolling: touch;(解决苹果下不流畅)
3.盒子添加事件@scroll="contentScroll" 加上引用ref
4.method里
contentScroll (e) {
let target = e.target || e.srcElement
this.scrollTop = target.scrollTop
if (target.scrollTop + target.clientHeight >= target.scrollHeight - 3) {
this.loadArticlesByTypeAndId()
}
},
对应生命周期
activated () {
this.scrollTop = sessionStorage.getItem('scrollTop')
this.$refs.list.scrollTo(0, this.scrollTop)
},
deactivated () {
sessionStorage.setItem('scrollTop', this.scrollTop)
},
另外,vue路由貌似可以纪录位置,但是要开启history模式,公司项目已根深蒂固没法改了,只能用这种方式实现
如果滚动的是循环出来的组件
将index传入组件
滚动距离用数组存,index存对应位置