From 2707d630059c301ee3244fe6511cf35b0c93746d Mon Sep 17 00:00:00 2001
From: zouzhibing <zouzhibing@anthead.cn>
Date: Mon, 13 Jun 2022 16:02:50 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E8=B7=AF=E7=94=B1=E5=B5=8C?=
 =?UTF-8?q?=E5=A5=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/index.ts                           |  2 +
 src/router/modules/nested.ts                  | 69 +++++++++++++++++++
 src/views/nested/menu1/index.vue              |  7 ++
 src/views/nested/menu1/menu1-1/index.vue      |  7 ++
 src/views/nested/menu1/menu1-2/index.vue      |  7 ++
 .../nested/menu1/menu1-2/menu1-2-1/index.vue  |  5 ++
 .../nested/menu1/menu1-2/menu1-2-2/index.vue  |  5 ++
 src/views/nested/menu1/menu1-3/index.vue      |  5 ++
 src/views/nested/menu2/index.vue              |  5 ++
 9 files changed, 112 insertions(+)
 create mode 100644 src/router/modules/nested.ts
 create mode 100644 src/views/nested/menu1/index.vue
 create mode 100644 src/views/nested/menu1/menu1-1/index.vue
 create mode 100644 src/views/nested/menu1/menu1-2/index.vue
 create mode 100644 src/views/nested/menu1/menu1-2/menu1-2-1/index.vue
 create mode 100644 src/views/nested/menu1/menu1-2/menu1-2-2/index.vue
 create mode 100644 src/views/nested/menu1/menu1-3/index.vue
 create mode 100644 src/views/nested/menu2/index.vue

diff --git a/src/router/index.ts b/src/router/index.ts
index b9dab33..a5e888e 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -11,6 +11,7 @@ import permissionRouter from './modules/permission'
 import tableRouter from './modules/table'
 import errorRouter from './modules/error'
 import excelRouter from './modules/excel'
+import nestedRouter from './modules/nested'
 
 
 interface extendRoute {
@@ -101,6 +102,7 @@ export const asyncRoutes = [
   chatRouter,
   componentsRouter,
   othersRouter,
+  nestedRouter,
     excelRouter,
     zipRoutes,
   errorRouter,
diff --git a/src/router/modules/nested.ts b/src/router/modules/nested.ts
new file mode 100644
index 0000000..48497f9
--- /dev/null
+++ b/src/router/modules/nested.ts
@@ -0,0 +1,69 @@
+
+
+/** When your routing table is too long, you can split it into small modules**/
+
+import Layout from "@/layout/index.vue";
+
+const nestedRouter = {
+    path: '/nested',
+    component: Layout,
+    redirect: 'noRedirect',
+    name: 'nested',
+    meta: {
+        title: '路由嵌套',
+        icon: 'School'
+    },
+    children: [
+      {
+        path: 'menu1',
+        component: () => import('@/views/nested/menu1/index.vue'),
+        name: 'menu1',
+        meta: { title: '菜单1', },
+        alwaysShow:true,
+        children: [
+          {
+            path: 'menu1-1',
+            component: () => import('@/views/nested/menu1/menu1-1/index.vue'),
+            name: 'menu1-1',
+            meta: { title: '菜单 1-1' }
+          },
+          {
+            path: 'menu1-2',
+            component: () => import('@/views/nested/menu1/menu1-2/index.vue'),
+            name: 'menu1-2',
+            redirect: '/nested/menu1/menu1-2/menu1-2-1',
+            meta: { title: '菜单 1-2' },
+            children: [
+              {
+                path: 'menu1-2-1',
+                component: () => import('@/views/nested/menu1/menu1-2/menu1-2-1/index.vue'),
+                name: 'menu1-2-1',
+                meta: { title: '菜单 1-2-1' }
+              },
+              {
+                path: 'menu1-2-2',
+                component: () => import('@/views/nested/menu1/menu1-2/menu1-2-2/index.vue'),
+                name: 'menu1-2-2',
+                meta: { title: '菜单 1-2-2' }
+              }
+            ]
+          },
+          {
+            path: 'menu1-3',
+            component: () => import('@/views/nested/menu1/menu1-3/index.vue'),
+            name: 'menu1-3',
+            meta: { title: 'menu1-3' }
+          }
+        ]
+      },
+        {
+            path: 'menu2',
+            component: () => import('@/views/nested/menu2/index.vue'),
+            name: 'nested-menu2',
+            meta: { title: '菜单2', }
+        },
+
+    ]
+}
+
+export default nestedRouter
diff --git a/src/views/nested/menu1/index.vue b/src/views/nested/menu1/index.vue
new file mode 100644
index 0000000..bdd5fc8
--- /dev/null
+++ b/src/views/nested/menu1/index.vue
@@ -0,0 +1,7 @@
+<template >
+  <div style="padding:30px;">
+    <el-alert title="menu 1" :closable="false">
+      <router-view />
+    </el-alert>
+  </div>
+</template>
diff --git a/src/views/nested/menu1/menu1-1/index.vue b/src/views/nested/menu1/menu1-1/index.vue
new file mode 100644
index 0000000..44da904
--- /dev/null
+++ b/src/views/nested/menu1/menu1-1/index.vue
@@ -0,0 +1,7 @@
+<template >
+  <div style="padding:30px;">
+    <el-alert title="menu 1-1" type="success" :closable="false">
+      <router-view />
+    </el-alert>
+  </div>
+</template>
diff --git a/src/views/nested/menu1/menu1-2/index.vue b/src/views/nested/menu1/menu1-2/index.vue
new file mode 100644
index 0000000..19ba25d
--- /dev/null
+++ b/src/views/nested/menu1/menu1-2/index.vue
@@ -0,0 +1,7 @@
+<template>
+  <div style="padding:30px;">
+    <el-alert title="menu 1-2" type="success" :closable="false">
+      <router-view />
+    </el-alert>
+  </div>
+</template>
diff --git a/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue b/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue
new file mode 100644
index 0000000..12d0450
--- /dev/null
+++ b/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue
@@ -0,0 +1,5 @@
+<template>
+  <div style="padding:30px;">
+    <el-alert title="menu 1-2-1" type="warning" :closable="false" />
+  </div>
+</template>
diff --git a/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue b/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue
new file mode 100644
index 0000000..f6a8bbf
--- /dev/null
+++ b/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue
@@ -0,0 +1,5 @@
+<template>
+  <div style="padding:30px;">
+    <el-alert title="menu 1-2-2" type="warning" :closable="false" />
+  </div>
+</template>
diff --git a/src/views/nested/menu1/menu1-3/index.vue b/src/views/nested/menu1/menu1-3/index.vue
new file mode 100644
index 0000000..bf54875
--- /dev/null
+++ b/src/views/nested/menu1/menu1-3/index.vue
@@ -0,0 +1,5 @@
+<template>
+  <div style="padding:30px;">
+    <el-alert title="menu 1-3" type="success" :closable="false" />
+  </div>
+</template>
diff --git a/src/views/nested/menu2/index.vue b/src/views/nested/menu2/index.vue
new file mode 100644
index 0000000..6d54e47
--- /dev/null
+++ b/src/views/nested/menu2/index.vue
@@ -0,0 +1,5 @@
+<template>
+  <div style="padding:30px;">
+    <el-alert title="menu 2" :closable="false" />
+  </div>
+</template>