params参数

使用方法

1.声明接收params参数

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
{
    path:'/home',
    component:Home,
    children:[
        {
            path:'news',
            component:News,
        },
        {
            path:'message',
            component:Message,
            children:[
                {
                    name:'xiangqing',
                    path:'detail/:id/:title', //使用占位符声明接收params参数
                    component:Detail,
                }
            ]
        }
    ]
}

2.传递参数

1
2
3
4
5
6
7
8
9
10
11
12
13
<!-- 跳转路由并携带params参数，to的字符串写法 -->
<router-link :to="`/home/message/detail/666/你好`">{{m.title}}</router-link>
 
<!-- 跳转路由并携带params参数，to的对象写法 -->
<router-link :to="{
    name:'xiangqing',
    params:{
        id:666,
        title:'你好'
    }
}">
    {{m.title}}
</router-link>

3.接收参数

1
2
$route.params.id
$route.params.title