vue路由的params传参和query传参

1、params传参:需要在路由配置文件中,在路由后面加上占位符
示例:

path: "/search/:keyword",

那么如何指定params参数可传或不穿呢,在占位符后面加上?即可。
path: "/search/:keyword?",

params传参为空串的情况如何解决?传参时加上undefined判断
this.$router.push({ name: "search", params: { keyword: "" || undefined, }, });

在声明式导航时在路由后面这样传参:
this.$router.push(`/search/${this.keyword}`)

params传参取值:$route.params.keyword

2、query传参
在路由后面用?key val拼接即可,示例:
this.$router.push(`/search/${this.keyword}?key=${this.keyword+1}`)

【vue路由的params传参和query传参】query传参取值:$route.query.key

    推荐阅读