How to make nested "pages" in vue?

A

Alexander Zhukov2019-03-13 12:01:34

JavaScript

Alexander Zhukov, 2019-03-13 12:01:34

Hello! I started studying for a couple of days, I wanted to make a nested navigation like:
+home +Items
+subItems_link
The layout of the input component looks like this:

<template>
  <body id="app">
    <TheHeader></TheHeader>
    <main class="b-content">
      <transition name="slide-fade">
        <router-view></router-view>
      </transition>
    </main>
    <TheFooter/>
  </body>
</template>

Therefore, when I follow the Items link, everything is displayed correctly, but when I want to go to the child URLs, the child is not displayed, I didn’t find anything intelligible on the Internet, because the question is most likely stupid)
If you make another router-view in Items (not I'm sure that this is the right decision) then everything is displayed, while how to remove the parent component from the child ones?

<router-link  class="b-nav-item__link" to="/" exact>Home<router-link>
<router-link  class="b-nav-item__link" to="/items">Items<router-link>
<router-link  class="b-nav-item__link" to="/items/school">Items-school<router-link>

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

V

Vladislav, 2019-03-13
@VladZen

In addition to the previous answer, have a look at Nested Named Views