vue router 的params和query传参的使用和区别

1.query可以使用path或者name来进行携带跳转地址，params只能使用name携带跳转地址。
query传参：

路由配置：
		{
			path:'/city',
			name:'City',
			component:City
		}

页面带参数跳转：
		this.$router.push({ 
			path:'/city',
			name:'City', 
			query: { 
				cityid: this.Cityid,
				cityname:this.Cityname 
		}})
 
接收参数：this.cityid = this.$route.query.cityid;

params传参：

路由配置：
		{
			path:'/city/:cityid/:cityname',
			name:'City',component:City
		}

页面带参数跳转：
		this.$router.push({ 
			name:'City', 
			params: { 
				cityid: this.Cityid,
				cityname:this.Cityname 
		}})
 
接收参数：this.cityid = this.$route.params.cityid;

2.传参跳转页面时，query不需要在跳转地址上配置参数就能在新的页面获取到参数，params也可以不用配，但是params不在跳转地址上配参数的话，当用户刷新当前页面的时候，params携带的参数就会消失。
也就是说使用params不在跳转地址上配参数跳转，只有第一次进入页面参数有效，刷新页面参数就会消失。