Vue 路由props 多路由参数时使用

传统路由参数获取

this.$route.query.id
this.$route.query.a
this.$route.query.b
this.$route.query.c
this.$route.query.d
this.$route.query.e
......

第一种接收parpas参数 使用props

   {
        name: 'user',
        path: '/user/:id/:age',
        component: User,
        props: true//
    }

user组件里获取

 <div>
     {{id}}
    {{age}}
  </div>

 props: ['id', 'age'],

第二种接收query参数 使用props

{
                name: 'user',
                path: '/user',
                component: User,
                props($route) { return { id: $route.query.id, age: $route.query.age } }
}

 {{id}}     
 {{age}}
 
 props: ['id', 'age'],