Vue路由传参方式

name传参

发送参数：
在路由中写好
接收参数：

$route.name

命名路由（post传参）

发送参数：

this.$router.push({ name: 'news', params: { userId: 123 }});

接收参数：

{{this.$route.params.userId}}

注意：该方式不需要配置路由

查询参数（get传参）

发送参数：

this.$router.push(''/news'?userId=123 ')

this.$router.push({ path: '/news', query: { userId: 123 }});

	this.$router.push({
        name: "news",
        query: {
          id: 123 
        }
    })

接收参数：

{{this.$route.query.userId}}

注意：该方式需要配置路由

二者区别：

1.命名路由搭配params，刷新页面参数会丢失
2.查询参数搭配query，刷新页面数据不会丢失
3.post 类型的传参必须用 name ，如果用 path，那么 addres 页面的 params 是空的。
4.不管是 get 类型的传参还是 post 类型的传参，但凡用 name 必须要在路由里配置好 name 属性。
5.参数为 Object 类型时要注意