From 6b62edc3232b1b0a8f70572f10363374c46fd5e0 Mon Sep 17 00:00:00 2001
From: pany <939630029@qq.com>
Date: Mon, 28 Aug 2023 19:12:35 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96=20CompConsumer=20?=
 =?UTF-8?q?=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layouts/components/AppMain.vue            |  3 ++
 .../components/CompConsumer/index.ts}         | 30 +++++++++----------
 2 files changed, 17 insertions(+), 16 deletions(-)
 rename src/{layout/components/comp-consumer.ts => layouts/components/CompConsumer/index.ts} (58%)

diff --git a/src/layouts/components/AppMain.vue b/src/layouts/components/AppMain.vue
index 15500823..dbe8980f 100644
--- a/src/layouts/components/AppMain.vue
+++ b/src/layouts/components/AppMain.vue
@@ -1,5 +1,7 @@
 <script lang="ts" setup>
 import { useTagsViewStore } from "@/store/modules/tags-view"
+// import { CompConsumer } from "./CompConsumer"
+
 const tagsViewStore = useTagsViewStore()
 </script>
 
@@ -12,6 +14,7 @@ const tagsViewStore = useTagsViewStore()
           <keep-alive :include="tagsViewStore.cachedViews">
             <component :is="Component" :key="route.path" />
           </keep-alive>
+          <!-- <CompConsumer :component="Component" /> -->
         </transition>
       </router-view>
     </div>
diff --git a/src/layout/components/comp-consumer.ts b/src/layouts/components/CompConsumer/index.ts
similarity index 58%
rename from src/layout/components/comp-consumer.ts
rename to src/layouts/components/CompConsumer/index.ts
index 60d2438e..7f71ec74 100644
--- a/src/layout/components/comp-consumer.ts
+++ b/src/layouts/components/CompConsumer/index.ts
@@ -1,34 +1,33 @@
-import { useTagsViewStore } from "@/store/modules/tags-view"
-import type { VNode } from "vue"
-import { h } from "vue"
-import { KeepAlive, cloneVNode, createVNode, defineComponent } from "vue"
+import { type VNode, cloneVNode, createVNode, defineComponent, h, KeepAlive } from "vue"
 import { useRoute } from "vue-router"
+import { useTagsViewStore } from "@/store/modules/tags-view"
+
 interface CompConsumerProps {
-  component?: VNode
+  component: VNode
 }
+
 const compMap = new Map<string, VNode>()
+
 export const CompConsumer = defineComponent(
   (props: CompConsumerProps) => {
     const tagsViewStore = useTagsViewStore()
     const route = useRoute()
     return () => {
       const component = props.component
-      // 判断当前是否包含name，如果不包含name，那就直接处理掉name
+      // 判断当前是否包含 name，如果不包含name，那就直接处理掉 name
       if (!route.name) return component
-      // 获取当前组件的name
-      const compName = (component?.type as any)?.name
+      // 获取当前组件的 name
+      const compName = (component.type as any)?.name
       const routeName = route.name as string
       let Comp: VNode
       if (compMap.has(routeName)) {
-        // @ts-expect-error this is Node
-        Comp = compMap.get(routeName)
+        Comp = compMap.get(routeName)!
       } else {
-        const node = cloneVNode(component!)
-        if (compName && compName === routeName)
-          // @ts-expect-error this is obj
-          node.type.name = `__${compName}__` + "CUSTOM_NAME"
+        const node = cloneVNode(component)
+        if (compName && compName === routeName) {
+          ;(node.type as any).name = `__${compName}__CUSTOM_NAME`
+        }
         // @ts-expect-error this is VNode
-        // eslint-disable-next-line vue/one-component-per-file
         Comp = defineComponent({
           name: routeName,
           setup() {
@@ -47,7 +46,6 @@ export const CompConsumer = defineComponent(
         }
       )
     }
-    // eslint-disable-next-line vue/one-component-per-file
   },
   {
     name: "CompConsumer",