好家伙,
1.路由嵌套
给路由写一个子路由,格式大概这个样子
{ //登录页 path: '/main', component: Main, // 写入子模块 children: [ { path: '/user/profile', component: UserProfile, }, { path: '/user/list', component: UserList, }, ] },
2.参数传递
(1)配置路由参数:在路由的一个path下绑定一个属性
path:"/login/:id",绑定id
小插曲:router-link的参数
// 命名路由带路由参数params,地址栏是/apple/red <router-link :to="{name: 'applename', params: { color: 'red' }}"> to apple</router-link>
(2)链接传递参数
// 同上 <router-link :to="{name: 'Userlogin', params: { id: '1' }}"> to apple</router-link>
(3)页面显示参数
方法一:直接route
<div>{{ $route.params.id }}</div>
方法二:(插槽那边用过的,弄个props接口)
子路径那里加上
props: ture
<templete> <div>{{id}}</div> </templete>
<script> export dafault{ props: ['id'], }
</script>
3.组件重定向
写一个新路径,让该路径回到主页面
作用:类似返回首页的功能
上代码:
{ path:"/huijiashizuihaodeliwu", //随便设 redirect:"/main" //要返回回的路径 }