From 444ed4ba3c9be9864c9a7811224e6d1d805aad1b Mon Sep 17 00:00:00 2001
From: wanchun <445436867@qq.com>
Date: Tue, 22 Mar 2022 11:32:35 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=94=AF=E6=8C=81keep-alive?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/runtime/views/MultiTabProvider.vue    | 29 +++++++++++++++++--
 packages/fes-template/src/pages/editor.vue    |  3 +-
 2 files changed, 29 insertions(+), 3 deletions(-)

diff --git a/packages/fes-plugin-layout/src/runtime/views/MultiTabProvider.vue b/packages/fes-plugin-layout/src/runtime/views/MultiTabProvider.vue
index 910c00a0..2c355744 100644
--- a/packages/fes-plugin-layout/src/runtime/views/MultiTabProvider.vue
+++ b/packages/fes-plugin-layout/src/runtime/views/MultiTabProvider.vue
@@ -36,7 +36,14 @@
             </keep-alive>
         </router-view>
     </template>
-    <router-view v-else></router-view>
+    <router-view v-else v-slot="{ Component, route }">
+        <keep-alive :include="includePages">
+            <component
+                :is="getComponent(Component, route)"
+                :key="getPageKey(route)"
+            />
+        </keep-alive>
+    </router-view>
 </template>
 <script>
 import {
@@ -144,6 +151,22 @@ export default {
                 default:
             }
         };
+        const includePages = ref([]);
+        const getComponent = (Component, _route) => {
+            if (_route.meta['keep-alive']) {
+                const name = _route.meta?.name || _route.name;
+                if (name) {
+                    // 修改组件的 name
+                    Component.type.name = name;
+                    // 缓存的关键是组件name在keep-alive的include列表
+                    if (!includePages.value.includes(name)) {
+                        includePages.value = [...includePages.value, name];
+                    }
+                }
+            }
+
+            return Component;
+        };
         return {
             route,
             pageList,
@@ -152,7 +175,9 @@ export default {
             switchPage,
             handlerMore,
             handleCloseTab,
-            actions
+            actions,
+            getComponent,
+            includePages
         };
     }
 };
diff --git a/packages/fes-template/src/pages/editor.vue b/packages/fes-template/src/pages/editor.vue
index e4a89b05..6aed5d6b 100644
--- a/packages/fes-template/src/pages/editor.vue
+++ b/packages/fes-template/src/pages/editor.vue
@@ -11,7 +11,8 @@
 <config>
 {
     "name": "editor",
-    "title": "$editor"
+    "title": "$editor",
+    "keep-alive": true
 }
 </config>
 <script>