Vue路由传参和接收参数

Vue路由传参以及接收参数的几种方法

vue路由传参方式可以划分为params传参、query传参和url字符串拼接(编程式导航)

方法一：query

//传参
this.$router.push({
     path: '/deviceInfo',
     query: { deviceId: '202101075343' }
});
//接收参数
this.$route.query.deviceId

方法二：param

//传参
router.push({ 
	name: 'device', 
	params: { deviceId: '202101075343' }
})
//接收参数	
this.$route.params.deviceId

方法三：字符串拼接

//传参
router.push({ 
	name: 'device', 
	params: { deviceId: '202101075343' }
})
//接收参数	
this.$route.params.deviceId