命名视图
命名视图和slot 一样就是具名插槽一样 ,给坑取名字,路由跳转到指定的插槽中
给坑取名字
<template>
<div>
<router-view name="top"></router-view>
<hr>
<router-view name="bottom"></router-view>
<hr>
<router-view></router-view>
</div>
</template>
<script>
export default {}
</script>
在坑中填入对应路由
import Vue from 'vue'
import VueRouter from 'vue-router'
import PageA from './views/PageA.vue'
import PageB from './views/PageB.vue'
Vue.use(VueRouter)
export default new VueRouter({
routes: [
{
path: '/',
// component: PageA
components: {
// key: value key 坑名 value 组件
top: PageA,
bottom: PageB,
default: PageA
},
//更换名字
alias: '/hello'
}
]
})
