How do vue nested routes switch between parent and child content?

has the following routes
app.vue > a.vue > b.vue

a.vue is a full-screen content
b.vue is also a full-screen content, and less parts are shared with a, so you can ignore
router-view at the bottom of a.vue

.

when a-> b, the content of an is above the page, but the content of b is below it

  1. how do I hide a content?
  2. is this correct and reasonable, and is there any other way?

1. The judgment can be made in router.beforeEach.
Why not put 2.router-view in app.vue.


if you don't want to display it on the same page, you don't have to use nested routing.


< router-view > is placed in app.vue, and app.vue child routes a.vue, b.vue ~


give router-view a level of z-index


according to your description, an and b should be level, and router-view is more reasonable in app.vue.
if you have to app.vue > a.vue > b.vue, you can only use the style to set the content of b to absolute full screen.

Menu