vue-router中的滚动行为

滚动行为：

使用前端路由，当切换到奥新路由时，想要页面滚动到顶部，或者是保持原先的滚动位置，就像重新加载页面那样。vue-router,可以自定义路由切换时如何滚动

这个功能只在支持 history.pushState 的浏览器中可用。

scrollBehavior(to,from,savePosition){//点击浏览器的前进后退或切换导航触发

        console.log(to);//要进入的目标路由对象  要去向哪里

        console.log(from);离开的路由对象  从哪里来

        console.log(savePosition);//记录滚动条的坐标，点击前进后退的时候记录值

}

看下图是to、from和savePosition的打印结果：

看下面的使用示例

var Router = new Router({
  mode:'history',
  scrollBehavior(to,from,savePosition){
//在按下前进或后退按钮时，就会让页面滚动到指定的地方
    
   /* if(savePosition){
      return savePosition;
    }else{
      return {x:0,y:0};
    }*/

//滚动到指定的锚点
    if(to.hash){
      return {
        selector:to.hash
      };
    }

  }
})