vue：传参的三种方式以及props的三种写法以及传参的注意事项

vue：传参的三种方式

字符串： this.$router.push("/search/" + this.keyword + "?k=" + this.keyword.toUpperCase()）
模板： /search/${this.keyword}?k=+${this.keyword.toUpperCase()}
对象：this.$router.push({name: "search",params: {keyword: this.keyword, }, query: {k: this.keyword.toUpperCase(),},})
注意：
- params参数需要在组件路由配置中添加占位符path: '/search/:keyword',，
- 对象传参需要在组件路由配置中添加name属性name: 'search',
- //keyword?表示此字段可传可不传 path: '/search/:keyword?',
- path不可以和params一起使用，必须使用name配合
- //不可以使空串，使用undefined // params: { keyword: '' || undefined },
- 路由组件props三种写法：
1. 布尔值，只能有params参数：props：true
2. 对象写法：props:{a:1,b:2}
3. 函数写法：props:($route)=>({keyword:$route.params.keyword,k:$route.query.k})
————————————————
版权声明：本文为CSDN博主「helloWorldJavaQi」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/helloWorldJavaQi/article/details/121979683