1、query传参

<router-link to="/page1?name='张三'">query</router-link>

直接在path后面加 ?参数,页面跳转的时候 参数会传过去

也可以换个写法:

<input @click="goQuery()" type="button" value="query">
goQuery(){
  this.$router.push({
    path:'/page1',
    query:{name:'张三'}
  })
},

 通过this.$router.push做路由跳转的话,query请求 使用的是path,url会显示参数,所以是get请求

2、params传参

<router-link to="/page2/'张三'">params</router-link>

 //同时在路由配置

{
  path: '/page2/:name',
  name: 'page2',
  component: page2
},

params传参 是在/后面直接加参数传参,/page2/'张三' 这样的url会直接映射到对应的路由,来达到传参的效果

也可以换个写法 :

<input @click="goParams()" type="button" value="params">
goParams(){
  this.$router.push({
    name:'page2',
    params:{name:'张三2'}
  })
}

 通过this.$router.push做路由跳转的话,params使用的是name,并且url不会显示参数,所以是post请求

Logo

前往低代码交流专区

更多推荐