vue-routerでネストした際に、子コンポーネントが描画されない

■状況
vue-routerを二箇所に使用し、SPAで画面を作成しようとしています。(一つが青部分、もう一つが緑部分)
しかし、子コンポーネントの方が正しく描画されない部分が解決出来ません。(NavやLoginにTopが再度描画されるバグが起こっています。)

コンポーネント設計はこの様な形にしています。

ソースコードは以下の通りです。
単一ファイルコンポーネントを使用しています。
■App.js

js
1import Vue from 'vue'
2// ルーティングの定義をインポートする
3import router from './router'
4// ルートコンポーネントをインポートする
5import App from './App.vue'
6
7
8new Vue({
9    el: '#app',
10    router,             // ルーティングの定義を読み込む
11    components: {App},  // ルートコンポーネントの使用を宣言する
12    template: '<App />' // ルートコンポーネントを描画する
13});

■App.vue

vue
1<template>
2    <div>
3<!--ヘッダー-->
4        <Header @menuOpen="menuModalOpen" />
5<!--モーダル-->
6        <MenuModal :menuFlg="this.menuFlg"
7                   v-if="menuFlg"
8                   @menuClose="MenuModalClose"
9        />
10<!--メイン 親vue-router-->
11      <router-view></router-view>
12<!--フッター-->
13        <Footer />
14
15    </div>
16</template>
17
18<script>
19  import Header from './components/Header'
20  import MenuModal from './components/MenuModal'
21  import Footer from './components/Footer'
22
23  export default {
24    components:{
25      Header,
26      MenuModal,
27      Footer,
28    },
29    data() {
30      return {
31        menuFlg: ''
32      }
33    },
34    methods: {
35      //メニューの開け締め
36      menuModalOpen: function(){
37        this.menuFlg = true;
38      },
39      MenuModalClose: function(){
40        this.menuFlg = false;
41      }
42
43
44    }
45  }
46</script>
47

■router.js

js
1import Vue from 'vue'
2import VueRouter from 'vue-router'
3
4//コンポーネントをインポート
5
6import Top from './components/Top'
7import Mypage from './components/Mypage'
8import Nav from './components/Nav'
9import Login from './components/Login'
10
11// VueRouterプラグインを使用する
12// これによって<RouterView />コンポーネントなどを使うことができる
13Vue.use(VueRouter)
14
15// パスとコンポーネントのマッピング
16// childrenで子vue-routerを使用したい
17const routes = [
18  {
19    path: '',
20    component: Top,
21    children:[
22      {
23        path: 'nav',
24        component: Nav
25      },
26      {
27        path: 'login',
28        component: Login
29      }
30    ]
31  },
32  {
33    path: '/mypage',
34    component: Mypage
35  },
36]
37
38// VueRouterインスタンスを作成する
39const router = new VueRouter({
40  mode: 'history', //#が出ないように追加
41  routes
42})
43
44// VueRouterインスタンスをエクスポートする
45// app.jsでインポートするため
46export default router
47

■MenuModal.vue

vue
1<template>
2    <div class="p-modal__mask">
3        <div class="p-modal__container">
4            <div class="p-menuNav">
5              <h2 class="p-menuNav__title"><i class="fas fa-cloud-upload-alt"></i> タイトル</h2>
6              <div class="p-menuNav__close" @click="menuClose"><i class="fas fa-times"></i></div>
7
8<!--                ここに入れていく 子vue-router-->
9              <router-view></router-view>
10
11            </div>
12        </div>
13    </div>
14</template>
15
16<script>
17  export default {
18    data() {
19      return {
20      }
21    },
22    methods: {
23      menuClose: function(){
24        console.log('aaa');
25        this.$emit('menuClose');
26      }
27    }
28  }
29</script>
30

■Nav.vue

vue
1<template>
2  <nav class="p-menu">
3    <ul class="p-menu__ul">
4      <li class="p-menu__list"><a class="c-link__menu" href="#">ユーザー情報を変更</a></li>
5      <li class="p-menu__list"><a class="c-link__menu" href="#">パスワードを変更</a></li>
6      <li class="p-menu__list"><a class="c-link__menu" href="#">アカウントを追加</a></li>
7      <li class="p-menu__list"><a class="c-link__menu" href="#">アカウントを解除</a></li>
8      <li class="p-menu__list"><a class="c-link__menu" href="#">よくある質問</a></li>
9      <li class="p-menu__list"><a class="c-link__menu" href="#">お知らせ</a></li>
10      <li class="p-menu__list"><a class="c-link__menu" href="#">プライバシーポリシー</a></li>
11      <li class="p-menu__list"><a class="c-link__menu" href="#">お問い合わせ</a></li>
12      <li class="p-menu__list"><a class="c-link__menu" href="#">利用規約</a></li>
13      <li class="p-menu__list"><a class="c-link__menu" href="#">ログアウト</a></li>
14    </ul>
15  </nav>
16</template>
17
18<script>
19  export default {
20
21  }
22</script>
23