3种vue路由传参的基本模式

```

在路由配置中，需要对应添加一个带有动态路由参数的路径，如/describe/:id。在子组件中，可以通过$route.params.id获取传递的参数值。

二、方案二：通过路由的name和params传递参数

除了通过路径传递参数外，你还可以使用路由的name属性来确定匹配的路由，并通过params传递参数。在父组件中，使用this.$router.push进行路由跳转时，通过name属性指定路由名称，并在params中传递参数。

在路由配置中，无需使用动态路由参数，只需定义路径和name即可。在子组件中，同样可以通过$route.params.id获取传递的参数值。

三、方案三：通过query传递参数

第三种方式是通过query传递参数。在父组件中，使用this.$router.push进行路由跳转时，通过path属性指定路径，并在query中传递参数。这样传递的参数会出现在URL后面，以?id=的形式呈现。

在路由配置中，无需特殊处理query参数。在子组件中，可以通过$route.query.id获取传递的参数值。

需要注意的是，在子组件中获取参数时，应该使用$route而不是$router。$route是路由信息对象，包含了当前激活的路由状态信息，而$router是路由实例，用于操作路由。

本文介绍了Vue路由传参的三种基本模式，包括通过路径携带参数、通过路由的name和params传递参数以及通过query传递参数。在实际开发中，你可以根据具体需求选择适合的传参方式。希望本文对你的学习和开发有所帮助，也希望大家多多支持狼蚁SEO。