$route常用的方法解释

$route获取的是当前url地址的信息，通过$route可以拿到的数据包括

fullPath: "/Namevue/test"   

router: ""     //路由规则所属的路由器

name: "Namevue"    //当前路径的名字，如果没有使用具名路径，则名字为空

params: {id: "test"}    //路由中的定义的动态片段和全匹配片段的键值对

path: "/Namevue/test"    //当前路由对象的路径，会被解析为绝对路径，如 "/home/news"

query: {}   //路由中查询参数的键值对。例如，对于 /home/01?favorite=yes ，会得到$route.query.favorite == ‘yes‘ 。

注意：query和params的区别

params传递参数需要在路由文件中进行配置，例如  path: "/detail/:id/:name",    component: Detail,最终url生成的路径是detail/10/apple , 传参的方式是： this.$router.push({ path: "/detail/"+id });

query可以直接传递参数，且最终的url格式是 detail？id=10，传参的方式是：this.$router.push({ path: "/detail"，query：{id：this.id}});

query和params获取参数传递参数都是通过当前路由 this.$route

<p>当前路径：{{$route.path}}</p>

<p>当前参数：{{$route.params | json}}</p>

<p>路由名称：{{$route.name}}</p>

<p>路由查询参数：{{$route.query | json}}</p>

<p>路由匹配项：{{$route.matched | json}}</p>

query查询跳转使用方法有2种

1、在router-link直接使用   <router-link :to="{path:'/HelloWorld',query:{name:'linlin',age:'3'}}"> HelloWorld</router-link>

2、在点击事件调用方法使用

handlclick(){

       this.$router.push({

         path:"/HelloWorld",

         query:{

           name:"lili",

           age:'31'

         } });

在方法中使用$route前面是需要加this的，在元素中使用是不用的直接$route