1、查询参login?id=12345

配置：（传参）:to="{name:'login', query:{id:'loginid'}}"

获取：（取参）this.$route.query.id

2、路由参数

配置：（传参）:to="{name:'login', params:{id:'loginid'}}"

获取：（取参）this.$route.params.id

3、路径参数register/registerid/info

配置：（传参）:to="{name:'register', params:{id:'registerid'}}"

配置路由规则：routes: [{path: '/register/:id/info', name: 'register', component: Register}]获取：（取参）this.$route.params.id

4、使用props直接取参

配置：（传参）:to="{name:'propsParams', params:{id:'propsParamsId'}}"

配置路由规则：routes: [// 通过props传值{path: '/propsParams', name: 'propsParams', props: true, component: PropsParams}]获取：（取参）

var PropsParams = {        template: `                
    
     传参直接取值                
     
                    直接拿到ID:{
   {id}}                
    
            `,        // 直接通过props取参        props: ['id']    }

5、通过JS进行传参

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

代码示例：

query传参：

params传参

params路径传参

params使用props直接取参

js传参

fullPath路由全路径监听

完整代码示例：