使用多个带有
name
属性的<router-view/>
(视图出口)来同时 (同级) 展示多个视图
//如果 router-view 没有设置名字,那么默认为 default。
<router-view class="view one"></router-view> // default
<router-view class="view two" name="a"></router-view> // a
<router-view class="view three" name="b"></router-view> // b
import Foo from './Foo.vue'
import Bar from './Bar.vue'
import Baz from './Baz.vue'
const router = new VueRouter({
routes: [
{
path: '/',
components: { //注意此处带有 s
//视图出口name: 组件名
default: Foo,
a: Bar,
b: Baz
}
}
]
})