vue-scroller返回页面记住滚动位置
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了vue-scroller返回页面记住滚动位置相关的知识，希望对你有一定的参考价值。
参考技术A 1，设置keepAlive：是否缓存router:
path: '/actlist',
name: 'actlist',
component: actlist,
meta:
keepAlive: true
2,设置渲染页面
app.vue
<keep-alive>
<router-view v-if="$route.meta.keepAlive"></router-view>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive"></router-view>
3,记录滚动位置并赋值
beforeRouteEnter(to,from,next)
if(!sessionStorage.askPositon || from.path == '/')//当前页面刷新不需要切换位置
sessionStorage.askPositon = '';
next();
else
next(vm =>
if(vm && vm.$refs.my_scroller)//通过vm实例访问this
setTimeout(function ()
vm.$refs.my_scroller.scrollTo(0, sessionStorage.askPositon, true);
,0)//同步转异步操作
)
,
beforeRouteLeave(to,from,next)//记录离开时的位置
sessionStorage.askPositon = this.$refs.my_scroller && this.$refs.my_scroller.getPosition() && this.$refs.my_scroller.getPosition().top;
next()
,
以上是关于vue-scroller返回页面记住滚动位置的主要内容，如果未能解决你的问题，请参考以下文章