Appearance
命名视图
适用于同级展示多个组件(有点类似插槽),示例:
vue
// 布局组件UserLayout.vue
<template>
<div class="user-layout">
<router-view name="header"></router-view>
<div class="user-content">
<router-view name="sidebar"></router-view>
<router-view></router-view>
<!-- 默认视图 -->
</div>
</div>
</template>
js
// 路由配置
{
path: '/user',
component: UserLayout,
children: [
{
path: 'profile',
components: {
default: UserProfile,
sidebar: UserSidebar
}
}
]
}