前端 · 02/13/2021 0

vue 路由传参

vue 路由传参方法:

1、query传参

this.$router.push({

path:’/你的路径’,

query:{

content: ‘传参数’

}

})

注意 是this.$router

取参数:

this.$route.query.content

这种情况下 query传递的参数会显示在url后面?content=?

2、通过params传参

name、通过路由属性中的name来确定匹配的路由,通过params来传递参数

this.$router.push({

name: xxx,

params:{

content:’xxx’

}

})

获取参数用this.$route.params.content

这种方式url中不显示参数

使用<router-link to=”/需要跳转的路由路径/需要传递的参数”></router-link>标签进行导航

这种方式url中会显示/页面/参数

<router-link to=”/页面/参数”></router-link>

获取参数用this.$route.params.content