调整

src/config/router.config.js

@@ -6,27 +6,35 @@ export const constantRouterMap = [
   {
     path: '/',
     name: 'index',
-    component: () => import('@/layouts/TabBarLayout'), // 路由懒加载
+    component: () => import('@/layouts/AppLayout'),
     redirect: '/home',
     meta: {
-      title: '首页', // 页面标题
-      keepAlive: false // keep-alive 标识
+      title: '首页',
+      keepAlive: false
     },
     children: [
       {
-        path: '/home',
-        name: 'Home',
-        component: () => import('@/views/home/index'),
-        meta: { title: '首页', keepAlive: false }
-      },
-      {
-        path: '/about',
-        name: 'About',
-        component: () => import('@/views/home/about'),
+        path: '/',
+        component: () => import('@/layouts/TabBarLayout'),
+        redirect: '/home',
         meta: {
-          title: '关于我',
+          title: '首页',
           keepAlive: false
-        }
+        },
+        children: [
+          {
+            path: '/home',
+            name: 'Home',
+            component: () => import('@/views/home/index'),
+            meta: { title: '首页', keepAlive: false }
+          },
+          {
+            path: '/about',
+            name: 'About',
+            component: () => import('@/views/home/about'),
+            meta: { title: '关于我', keepAlive: false }
+          }
+        ]
       }
     ]
   }

src/layouts/AppLayout.vue

@@ -0,0 +1,14 @@
+<template>
+  <div class="app-containter">
+    <keep-alive v-if="$route.meta.keepAlive">
+      <router-view></router-view>
+    </keep-alive>
+    <router-view v-else></router-view>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'AppLayout'
+}
+</script>