vue scroller返回页面记住滚动位置的实例代码

vue scroller返回页面记住滚动位置的实例代码

1，设置keepAlive：是否缓存

router:

{

path: '/actlist',

name: 'actlist',

component: actlist,

meta: {

keepAlive: true

}

}

2,设置渲染页面

app.vue

3,记录滚动位置并赋值

beforeRouteEnter(to,from,next){

if(!sessionStorage.askPositon || from.path == '/'){//当前页面刷新不需要切换位置

seshttp://sionStorage.askPositon = '';

next();

}else{

next(vm => {

iFCexvYUif(vm && vm.$refs.my_scroller){//通过vm实例访问this

setTimeout(function () {

vm.$refs.my_http://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返回页面记住滚动位置的实例代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，会及时回复大家的。在此也非常感谢大家对我们网站的支持！

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。