【vue-router】push 方法对应的路由组件传参方式

params 方式

this.push({name: 'user', params: {id: 'abc'})

this.push({path: 'user/${id}')

组件

const User = {
  props: ['id'],
  template: '<div>User {{ id }}</div>'
}

路由

{
   path: '/user/:id',
   components: User,
   props: true
 }

增加额外的静态参数

{
   path: '/user/:id',
   components: User,
   props: route => ({id: route.params.id, other: 'other'})
 }

path + query 方式

this.push({path: 'user', query: {id: 'abc'})

组件

const User = {
  props: ['id'],
  template: '<div>User {{ id }}</div>'
}

路由

{
   path: '/user',
   components: User,
   props: route => ({id: route.query.id})
 }

参考资料

vue-router 编程式的导航
vue-router 路由传参