路由传参，参数的几种写法

路由传参，参数的几种写法

路由跳转的方式分为：声明式导航(必须有to属性)，编程式导航(使用的是组件实例的$router.push/replce) 且还能进行其他的一些业务逻辑。

params参数：属于路径中的一部分，需要进行占位，query不属于路径中的一部分，不需要进行占位

路由传参的三种形式：字符串形式

（this.$router.push(/search/+this.keyword+?k=this.keyword. toUpperCase()）

模板字符串形式

（this.$router.push(/search/{this.keyword}?k={this.keyword. toUpperCase()}）

对象形式(最好用的形式) 在这里需要进行路由命名的操作

{
            path: "/search",
            component: Search,
            meta: { show: false },
            name: 'search'
        },

（this.$router.push(/search/{name}params{keyword:this.keyword},query:{k:this.keyword.toUpperCase()}）

流程代码

 goSearch() {
      //   this.$router.push("/search");
      this.$router.push({
        name: "search",
        params: { keyword: this.keyword },
        query: { k: this.keyword.toUpperCase() },
      });
    },

小总结

路由传递参数的三种方法

布尔值写法

对象写法:额外的给路由组件传递一些props

函数写法:可以params参数、query参数，通过props传递给路由组件