vue路由传参query和params的区别（详解！）

1.query使用path和name传参都可以，而params只能使用name传参。

query传参：

页面： this.$router.push({ path:'/city',name:'City', query: { cityid: this.Cityid,cityname:this.Cityname }}) 路由： { path:'/city', name:'City', component:City }, 接受参数： this.cityid = this.$route.query.cityid;

params传参：

页面： this.$router.push({ name:'City', params: { cityid: this.Cityid,cityname:this.Cityname }}) 路由： { path:'/city/:cityid/:cityname', name:'City', component:City }, 接受参数： this.cityid = this.$route.params.cityid;

2.传参时query不需要再路由上配参数，params也可以不用配，

   但是params不配的话，当用户刷新当前页面的时候，

   参数就会消失。也就是说使用params不在路由配参数跳转，

   只有第一次进入页面参数有效，刷新页面参数就会消失。

this.$router.push({ name:'City', query: { cityid: this.guessCityid,cityname:this.guessCityname }})

标签：传参,City,vue,name,cityid,params,query
来源： https://www.cnblogs.com/cxxb/p/11119702.html