命名式视图
2019-04-03 本文已影响0人
有一种感动叫做丶只有你懂
1.路由配置
假设我路由配置如下
[
{
path:'/home',
component:Home,
children:[{
path:'/home/home-list',
components:{
default:HomeList,
a:HomeAdd
},{
path:'/home/home-add',
component:HomeAdd
}
}]
}
]
2.在根路由下('/home')
<template>
<div>
<router-view/>
<router-view name="a"/>
</div>
</template>
3.在/home/home-list中的实际效果
可以显示HomeAdd里面的内容
//从路由配置中我们可以看出/home/home-list和/home/home-add是同级路由,但是我们在他们共同的根路由里面加了一个名字叫做a的router-view,并且在路由中增加了配置,所以当路由匹配到'/home/home-list'的时候HomeAdd这个组件也会被显示出来,显示出来的位置取决于在根路由里面的位置