（1）、query 传 死值
<router-link to="/地址 / 占位符 ? 键 = 值"> query - 死值 </router-link>
（2）、query 传 变量
<router-link :to=" `/地址 / 占位符 ? 键 = ${ 值 }` "> query - 变量 </router-link>
（3）、params
<router-link :to=" ` / 地址 / ${ 占位符 }? 键 = ${ 值 } `"> params </router-link>
（4）、对象的方式一
<router-link :to="{ path:'/cardetail/12', query:{name:'只能写到query属性传参'}, params:{userId:'有path params 不生效 '} }">对象的方式一</router-link>
（5）、对象方式二
<router-link :to="{ name:'CarDetail', query:{name:'只能写到query属性传参'}, params:{userId:' params和 name 结合使用 '} }">汽车详情-对象</router-link>
（6）、 编程式导航 传值
<button @click="方法名">编程式导航 -传参</button>
在下面定义方法：
（1）、 params 传参
this.$router.push(`/地址 / ${ 要传的数据 什么类型都行 （可以定义成变量）}`)
（2）、 query 传参
this.$router.push(` / 地址 /${params(要传的参数) }?键=${query(要传的参数) }`)
（3）、 对象 query
this.$router.push({
path:` / 地址 / ${ 传值 }`,
query:{name:'测试'},
params:{test:'行不行'} 不生效 不能和 path连用
（4）、 对象 params
如果是 动态路由 params 必须有和路由配置一样的字段
this.$router.push({
name:' 地址 ',
query:{可以用来传值},
params:{有name就用来传值} // 生效 和 name 连用 })
（7）、接受数据
this.$route 数据都在 this.$route 里面使用时可以解构出来
网友评论