路由配置scrollBehavior的使用方法

let router = new VueRouter({

  //点击浏览器的前进后退或切换导航触发

  scrollBehavior(to,from,savePosition){

    //to 要进入的目标路由对象要去向哪里

    //离开的路由对象  从哪里来

    //savePosition //记录滚动条的坐标  点击前进后退的时候记录

    //以下代码的场景为:a页面滚动条位置为1000,通过浏览器左上角的前进或后退,再返回到a页面时,这时候的滚动条位置不会变成0

      通过以下代码能记录下页面的滚动条位置,这样在重新返回页面的时候就能回到上次浏览的滚动条位置

    if (savePostion) {

      return savePositon;

    } else {

      return {x:0,y:0}

    }

 

    //通过代码时候路由调转,并定位到某个元素上

    路由名为:/about#abc

    if (to.hash) {

      return {

        selector: to.hash

      }

    }

    

  }

})

posted @ 2018-03-18 11:37  乐得逍遥  阅读(1166)  评论(0编辑  收藏  举报