vue-router的使用以及js如何跳转页面

vue-router的使用步骤：

把文件引入进来

创建组件的参数对象

创建vue-router实例

将vue-router实例和Vue实例关联起来

指定路由匹配的组件展示的位置 router-view

  
  
  
  
  


  

    
这是头部
    
    

      

        登录页
      
      

        注册页
      
      

        列表页
      
    
    
    //指定路由匹配的组件展示的位置 router-view
    
    
这是底部
  


  //把文件引入进来
  
  
  

路由规则对象中的其他一些属性和用法：

  
  
  
  


  

    

      

        login
      
      

        name
      
      

        path
      
      

        name params
      
      

        name query
      
    
    
  
  
  
  

路由参数的获取：

1、问号传参的方式：

      created(){
        // 当前组件中获取路由的？传递的参数，
        // 我们可以通过this.$route.query就可以获取到所有的参数了
        console.log(this.$route.query)
      }

2、动态路由的方式： 

     created(){
        // 如果使用的是动态路由进行参数传递的，那么我们可以通过this.$route.params来进行参数获取
        console.log(this.$route.params)
      }

通过js代码如何跳转其它页面（也叫编程式导航）：

routers.push('/login')

或者：this.$router.push({path: '/register'})

或者：this.$router.push({name: 'rg'})