vue中动态路由传递参数
使用this.$route.query获取传递过来的数据。使用this.$route.变量名获取传递过来的数据。
·
1.params类型
1.在配置路由时,在路径后声明变量
const routes = [
{
path:/user/test/:id,
component:User
}
]
2.传递参数:只需要在路由跳转时,在路径相应位置写入对应值即可
使用router-link标签进行路由跳转时
<router-link :to="'/user/'+1">用户</router-link>
使用代码进行路由跳转时
methods:{
userClick(){
this.$router.push("'/user/'+1")
}
}
3.接收数据
使用this.$route.变量名获取传递过来的数据
this.$route.id
2.query类型
1.使用router-link标签进行路由跳转时
<router-link :to="{path:'/user',query:{name:'zhangsan',id:3}}">用户</router-link>
2.使用代码进行路由跳转时
methods:{
userClick(){
this.$router.push({
path:'/user',
query:{
name:'zhangsan',
id:3
}
})
}
}
3.接收数据
使用this.$route.query获取传递过来的数据
this.$route.query.name
this.$route.query.id
更多推荐
已为社区贡献5条内容
所有评论(0)