Change components rendering instead of route

src/admin/App.vue

@@ -1,9 +1,9 @@
 <template lang="pug">
   .root-container
     header.header-container
-      Header
+      router-view(name="header")
     nav.nav-container
-      Navigation
+      router-view(name="nav")
     main.content-container
       router-view
 

src/admin/router/index.js

@@ -11,10 +11,6 @@ const router = new VueRouter({
 })
 
 router.beforeEach(async (to, from, next) => {
-
-  console.log('to ', to)
-  console.log('from ', from)
-  console.log('next ', next)
   const isAuthRequired = to.matched.some(record => record.meta.auth);
   const isUserLogged = store.getters["auth/isLogged"];
 

src/admin/router/routes.js

@@ -2,12 +2,18 @@ import About from '../components/About/About'
 import Reviews from '../components/Reviews/Reviews'
 import Works from '../components/Works/Works'
 import Login from '../components/Login'
+import Navigation from '../components/Navigation'
+import Header from '../components/Header'
 
 export default [
   {
     path: '/',
     name: 'about',
-    component: About,
+    components: {
+        default: About,
+        nav: Navigation,
+        header: Header
+    },
     meta:
       {
         title: "Блок «Обо мне»",
@@ -17,20 +23,28 @@ export default [
   {
     path: '/reviews',
     name: 'reviews',
-    component: Reviews,
+    components: {
+      default: Reviews,
+      nav: Navigation,
+      header: Header
+  },
     meta:
       {
-        title: "Блок «Работы»",
+        title: "Блок «Отзывы»",
         auth: true
       }
   },
   {
     path: '/works',
     name: 'works',
-    component: Works,
+    components: {
+      default: Works,
+      nav: Navigation,
+      header: Header
+  },
     meta:
       {
-        title: "Блок «Отзывы»",
+        title: "Блок «Работы»",
         auth: true
       }
   },