vue嵌套路由 如何切换父子内容?

Question

有如下路由
app.vue > a.vue > b.vue

a.vue中是一个全屏内容
b.vue也是一个全屏内容，且与a共用部分较少，可忽略
router-view 放在a.vue底部

当由a --> b 时，页面上面是a的内容 下面却是b内容

1. 该如何隐藏a内容呢?
2. 我这种做法是否正确合理，还有没有别的方式？

Answer 1

1.可以在router.beforeEach里面进行判断。
2.router-view为什么不放到app.vue里面。

Answer 2

如果你不想显示在同一个页面，不使用嵌套路由就行了啊。

Answer 3

<router-view> 置于 app.vue 中，app.vue 子路由 a.vue、b.vue ~

Answer 4

给router-view一个层级z-index就行了

Answer 5

按照你的描述，a和b应该是平级的，router-view放在app.vue里面比较合理。
如果一定要app.vue > a.vue > b.vue，那就只能用样式把b的内容设成absolute全屏。