Vue踩坑:vue-router传参params为空

在使用 vue-router 时,通过 this.$router.push() 进行路由跳转,传参 params 为空的原因和解决方法。

1. params传参

params传参:路径不能使用 path 只能使用 name,否则 params 将无效。

this.$router.push({
    name: '...', 
    params: {id: '...'}
})

取数据:this.$route.params.id

2. query传参

query传参:路径可以使用 path 或者 name

this.$router.push({
    path: '/xxx', 
    query: {id: '...'}
})

取数据:this.$route.query.id


  目录