vue.js通过路由实现经典的三栏布局实例代码

<template id="header">  <div class="header bg-primary text-center">    <h3>头部区域</h3>  </div></template><template id="left">  <div class="left bg-danger col-lg-2">    <h3>侧边栏区域</h3>  </div></template><template id="main">  <div class="main bg-info col-lg-10">    <h3>主体区域</h3>  </div></template>

<div id="app">  <router-view name="header"></router-view>  <router-view name="left"></router-view>  <router-view name="main"></router-view></div>

let router = new VueRouter({  routes: [    {      path: '/',      components: {        'header': header,        'left': left,        'main': main      }    }  ]});