命名视图

使用多个带有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
      }
    }
  ]
})