关于vue-router路由切换的问题

Question

感谢阅读或解答。
用2.0以后，发现还是有点不一样的。
进入正题，路由切换的时候传参数，
我是这样做的

this.$router.push({path: 'mallProductDetail', params: data})

data是我想穿入到目标组件的参数，问题是，我在目标组件怎么接收这个参数。
目标组件我是这样做的：

export default {
    name: 'mall-product-detail',
    data () {
      return {
        productInfo: obj
      }
    },
    beforeRouteEnter (to, from, next) {
      console.log('hello detail', to.params)
//      next(() => {
//        console.log(to.params)
//      })
    },
    methods: {
      onRouterBack () {
        this.$router.go(-1)
      },
      onBack () {
        console.log('on-back')
      }
    }
  }
  

请问这样有问题吗？参数接收不到哎。
请知道的朋友帮忙解答一下哦

Answer 1

params的用法应该是这样

//router配置部分
{
...
path:'/user/:id',
name:'userInfo'
...
}

//跳转代码
this.$router.push({name:'userInfo', params: {id:1}})
//or
this.$router.push({path:'/user/1')

这时会匹配到路由，地址也变成xxxx/user/1，在代码中取值为

this.$route.params.id //这里的id对应配置的:id

如果传入的参数较多可以考虑使用query方式传递