嵌套路由与拼接路由结合

嵌套路由（就是路由后面接children），拼接路由（相当于多个组件一并使用），写在components里，要拼接几个就写几个，然后<router-view></router-view>个数要与
拼接路由个数相同，代码如下
router里index
import login from '@/view/login'
import hello from '@/components/HelloWorld'
import aa from '@/components/aa'
import bb from '@/components/bb'

export default new Router({
  routes:[{
      path: '/login',
      name: 'login',
      component: login,
      children: [{
        path: 'login1',
        components: {
          default: hello,
          a: aa,
          b: bb
        }
      }]
    }]
    }),
login页面使用三个导入的组件
 <router-view ></router-view>//没有name所以components写的是default：hello
  <router-view  name="a"></router-view>
  <router-view  name="b"></router-view>
  总结：login页面显示在app挂载路由（app页面），login页面又嵌套了三个子路由（嵌套路由），三个子路由是三个组件拼接而成的（拼接路由），拼接路由写法
  略有不同。效果大致是，进入login页面显示login页面的内容，进入login/login1页面显示login页面+各个组件总和。login/login1页面先是组件内容总和渲染
  到login页面，login页面在渲染到app页面。

 

来源：https://www.cnblogs.com/abpf/p/11660884.html