vue 路由传参的两种方式

vue 路由传参虽然有好几种写法，但本质上分为两种，一种是 get 类型的传参，一种是 post 类型的传参。

1. get 类型的传参

get 类型传参的三种写法:

1. this.$router.push('/addres?id=12345')

	this.$router.push({
        path: "/addres",
        query: {
          id: 12345
        }
	})

	this.$router.push({
        name: "addres",
        query: {
          id: 12345
        }
    })

• 这三种写法都是 get 类型传参，参数会跟到路由后面，且页面刷新参数不会丢失。在 addres 页面用 this.$route.query.id 就可以获取到 id 的值。
  
• 我在 addres 页面打印了 this.$route ，可以看到通过这三种写法传参，打印出来的路由信息都是一样的。
  

2. post 类型的传参

• post 传参的写法

	// 当前页面
	this.$router.push({
        name: "addres",
        params: {
          id: 12345
        }
    })

• 在 addres 页面通过 this.$route.params.id 获取 id 值。

通过这种方式传参，参数不会跟在路由后面，而且刷新页面参数会丢失。

注意：
1.post 类型的传参必须用 name ，如果用 path，那么 addres 页面的 params 是空的。
2.不管是 get 类型的传参还是 post 类型的传参，但凡用 name 必须要在路由里配置好 name 属性。
3.参数为 Object 类型时要注意，详细信息请查看: vue 路由参数为 Object 时.

路由中的配置：

	{
    	path: '/addres',
    	name: 'addres',
    	component: () => import("../pages/addres.vue")
	},