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
上一篇下一篇

猜你喜欢

热点阅读