1. params传参

1. 1.params传参
2. 配置路由，声明接收params参数 { path:'/home', component:Home, children:[ { path:'news', component:News }, { component:Message, children:[ { name:'xiangqing', path:'detail/:id/:title?', //使用占位符声明接收params参数,添加问号代表title可传也可不传，占位了不传递也不加？会导致跳转后的url错误 component:Detail } ] } ] }
3. 传递参数 <router-link:to="/home/message/detail/666/你好">跳转 <router-link :to="{ name:'xiangqing', params:{ id:666, title:'你好' } }"
4. 跳转 this.$router.push("/home/message/detail"+this.id+this.title) <!-- 跳转并携带params参数，编程式路由导航的模板字符串写法 --> this.$router.push(/home/message/detail/${this.id}/${this.title}) （不能使用path配置项，必须使用name配置） this.$router.push({ name:"detail", params:{ id:this.id, title:this.title } }) 特别注意：路由携带params参数时，若使用to的对象写法，则不能使用path配置项，必须使用name配置！
5. 接收参数： $route.params.id$route.params.title 6.2 query传参
6. 传递参数 <router-link:to="/home/message/detail?id=666&title=你好">跳转、 <router-link:to="/home/message/detail?id=666&title=你好">跳转
   <router-link :to= path:'/home/message/detail', query:{ id:666, title:'你好' } }"
7. 跳转 this.$router.push("/detail"+"?k="+this.id.toUpperCase()+"&k1="+this.title.toUpperCase()) <!-- 跳转并携带query参数，编程式路由导航的模板字符串写法 --> this.$router.push(/detail?k=${this.id.toUpperCase()}&k1=${this.title.toUpperCase()}) this.$router.push({ path:"/detail", query:{ id:this.id, title:this.title } })
8. 接收参数： $route.query.id$route.query.title 7.路由的props配置
9. 传递参数 <router-link:to="/home/message/detail/666/你好">跳转 <router-link :to="{ name:'xiangqing', params:{ id:666, title:'你好' } }"
10. 跳转 this.$router.push("/home/message/detail"+this.id+this.title) <!-- 跳转并携带params参数，编程式路由导航的模板字符串写法 --> this.$router.push(/home/message/detail/${this.id}/${this.title}) （不能使用path配置项，必须使用name配置） this.$router.push({ name:"detail", params:{ id:this.id, title:this.title } })
11. 特别注意：路由携带params参数时，若使用to的对象写法，则不能使用path配置项，必须使用name配置！ 7. 接收参数： $route.params.id$route.params.title