动态路由传参

 

 

 

Ⅰ、 paramas传参

①index.js定义动态路由的格式

const routes =[
{path:"/user/:id/:name/:age",component:User}//动态路由的配置
]

 

 

②app.vue传参要格式对应

<div>
<router-link to="/user/1/lsq/18">&nbsp &nbsp user1</router-link>
<router-link to="/user/2/zsj/19">&nbsp &nbsp user2</router-link>
<router-link to="/user/3/zzr/18">&nbsp &nbsp user3</router-link>
</div>

③app.vue 接受

<template>
// 当前路由信息对象的 params.id

<h1>id {{$route.params.id}}</h1>
<h1>姓名{{$route.params.name}}</h1>
<h1>年龄{{$route.params.age}}</h1>
</template>