vue 路由传参总结

方法一

// 定义路由
{
	path: '/task/:id',
	name: 'Task',
	component: Task
}
// 路由跳转、传参
this.$router.push({
	path: `/task/${id}`
})
// 页面调用
this.$route.params.id

方法二

{
	path: '/task',
	name: 'Task',
	component: Task
}
// 路由传参
this.$router.push({
	name: 'Task',
	params: {
		id: 1
	}
})
// 页面调用
this.$route.params.id

方法三

{
	path: '/task',
	name: 'Task',
	component: Task
}
// 路由传参
this.$router.push({
	path: '/task',
	query: {
		id: 1
	}
})
// 页面获取id
this.$route.query.id

说说三个方法的优缺点：
第一个和第三个方法，传递的参数会跟在路由后面，暴露了信息；第二个方法，
传递的参数不会跟在路由后面，但是页面刷新参数也会清空。