vue的scrollBehavior滚动行为
2018-06-20 本文已影响0人
Amy_yqh
我们在使用vue-router做路由跳转时,如果想回退到上次页面时,并且向保存当时滚动到的位置,使用scrollBehavior。当然有些浏览器也会默认为我们保存我们当前浏览到哪的位置,但是现在我们这种方法可以自定义的设置。请看代码
return new Router({
routes,
scrollBehavior (to, from, savePosition) {
if (savePosition) {
return savePosition
} else {
return { x: 0, y: 0 }
}
}
})
from从哪个页面来,to去往哪个页面,两者都是一个对象,saveposition上次该页面滚动的位置,注意,该工能只用在浏览器的前进后退
比如我浏览这个页面时是滚动到这个位置
image.png
接着我点击了login,
image.png
当我点击浏览器的回退键时,页面保存在上次我浏览到的位置
image.png