vue不同route（页面）如何共用页面模板

Question

vue项目，想在有两个router（页面）几乎差不多，于是我想要他们共用一个页面文件，处理为两个不同的路由指定相同的的component外，还有其他办法吗？

1、假设我们页面有一部分相同，我们可以用子组件；
2、如果我们很多js代码相同，我们可以用mixins；

像我说的这种情况呢？

Answer 1

在router配置路由时，用同一个组件名，在组件内部，根据router的path值计算出变量值，根据变量值做条件，来显示具体的不同的地方

Answer 2

路由嵌套
在外层路由用相同的布局做父类组件
子路由嵌套在父类组件里

Answer 3

路由的方式

// 伪代码
[{
    path: '',
    component: Layout,
    // 可以配置Layout可接收的属性，来做一些定制
    props: {},
    children: [
      {
        path: '/',
        component: Home
      },
      {
        path: '/contact',
        component: Contact
      }
    ]
},
{
    path: '/other',
    component: Layout,
    children: [
      {
        path: '/',
        component: OtherChild
      },
      {
        path: '/otherchild',
        component: OtherChild2
      }
    ]
}

]

还有一种方式就是自己做一个Wrapper组件，通过slot机制内部加载容器内的组件