路由传参的三种模式

一、path传参（基本路由传参）

1. 传

this.$router.push({
path:'/path',
query:{
  参数名:值
}
})

2. 收

this.$route.query.参数名

二、动态路由匹配

1. 配制路由

{
   path:'/xxx/:参数名?',
   component...
}

2. 传

this.$router.push('/xxx/123')

3、收：

this.$route.params.参数名

三、通过name传参

1. 配制路由

{
path:'/xxx',
name:'xxx',
.....
}

2. 传（query方式）

this.$router.push({
   name:'xxx',
   query:{
     参数名:值
   }
})
接收：this.$route.query.参数名

3. 传（params方式）

注意：参数值不在url上体现，它的值是通过内存传递的，可传递大量数据，但只要刷新页面数据就没有了

this.$router.push({
   name:'xxx',
   params:{
     参数名:值
   }
})
接收：this.$route.params.参数名