滚动行为

什么是路由的滚动行为

当切换到新路由时，想要页面滚到顶部，或者是保持原先的滚动位置，就像重新加载页面那样

注意: 这个功能只在 HTML5 history 模式下可用。在这个模式下我们需要启动一个服务

我们用scrollBehavior 方法来做路由滚动

scrollBehavior 方法接收 to 和 from 路由对象。第三个参数 savedPosition 当且仅当 popstate 导航 (通过浏览器的 前进/后退 按钮触发) 时才可用

下面我们做一个小案例来了解一下

效果

    
    
     
滚动行为
    
     
        
      
       
        首页
       
        
      
       
        导航
       
        
      
       
        关于
       
        
      
       
        红色页面
       
        
      
       
        蓝色页面
       
    
     
    
     
    

vue滚动小案例