在一个页面里我们有2个以上router-view

 
 

现在的页面中有了三个标签，也就是说我们需要在路由里配置这三个区域，配置主要是在components字段里进行。

import Vue from 'vue'
import Router from 'vue-router'
import Hello from '@/components/Hello'
import Hi1 from '@/components/Hi1'
import Hi2 from '@/components/Hi2'
 
Vue.use(Router)
 
export default new Router({
  routes: [
    {
      path: '/',
      components: {    // 一个页面多个router-view,component需要改为components
        default:Hello,
        left:Hi1,
        right:Hi2
      }
    },{
      path: '/Hi',
      components: {
        default:Hello,
        left:Hi2,
        right:Hi1
      }
    }
 
  ]
})

home页面设置多个router-view,并且含子路由，重定向

path: '/',
      name: 'home',
      components:{
          default:resolve=>require(['@/components/home/home.vue'],resolve),
          deal_set:resolve=>require(['@/components/deal_set/deal_set.vue'],resolve)
      },
      redirect:'jdzh',/*重定向*/
      children:[{
          path:'jdzh',
          name:'jingdian',
          component:resolve=>require(['@/components/rightpart/jdzh/jdzh.vue'],resolve)
      },{
          path:'kpzh',
          name:'Kanpan',
                component:resolve=>require(['@/components/rightpart/kpzh/kpzh.vue'],resolve)
      }]