vue路由之视图命名

关键词：路由

<div id="app">
  <h1>服务政策</h1>
  <ul>
    <li><router-link to="/after">售后服务</router-link></li>
    <li><router-link to="/other">三包支持</router-link></li>
  </ul>
  <router-view ></router-view>
  <router-view  name="a"></router-view>
  <router-view  name="b"></router-view>
</div>

const Foo = { template: '<div>7天无理由退货</div>' }
const Bar = { template: '<div>两年质保</div>' }
const Baz = { template: '<div>免费升级固件</div>' }

const router = new VueRouter({
  routes: [
    { path: '/after',
      components: {
        default: Foo,
        a: Bar,
        b: Baz
      }
    },
    {
      path: '/other',
      components: {
        default: Baz,
        a: Bar,
        b: Foo
      }
    }
  ]
})

new Vue({
    router,
  el: '#app'
})