From b2b19b698fb98e7a31e16a0ee9670bc399607876 Mon Sep 17 00:00:00 2001
From: jinchuanwang <1085296443@qq.com>
Date: Tue, 21 May 2024 15:42:05 +0800
Subject: [PATCH] =?UTF-8?q?fix(Loading):=20=E5=A4=84=E7=90=86v-loading?=
 =?UTF-8?q?=E6=8C=87=E4=BB=A4=E5=92=8CuseLoading=E7=9A=84=E5=86=85?=
 =?UTF-8?q?=E5=AD=98=E6=B3=84=E9=9C=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Loading/src/createLoading.ts | 11 +++++++++--
 src/components/Loading/src/useLoading.ts    |  7 ++++++-
 src/directives/loading.ts                   |  2 +-
 3 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/components/Loading/src/createLoading.ts b/src/components/Loading/src/createLoading.ts
index b91db1fd40d..6402ad9a9d4 100644
--- a/src/components/Loading/src/createLoading.ts
+++ b/src/components/Loading/src/createLoading.ts
@@ -19,13 +19,14 @@ export function createLoading(props?: Partial<LoadingProps>, target?: HTMLElemen
 
   vm = createVNode(LoadingWrap);
 
+  let container: Nullable<HTMLElement> = null;
   if (wait) {
     // TODO fix https://github.com/anncwb/vue-vben-admin/issues/438
     setTimeout(() => {
-      render(vm, document.createElement('div'));
+      container && render(vm, (container = document.createElement('div')));
     }, 0);
   } else {
-    render(vm, document.createElement('div'));
+    render(vm, (container = document.createElement('div')));
   }
 
   function close() {
@@ -41,6 +42,11 @@ export function createLoading(props?: Partial<LoadingProps>, target?: HTMLElemen
     target.appendChild(vm.el as HTMLElement);
   }
 
+  function destory() {
+    container && render(null, container);
+    container = vm = null;
+  }
+
   if (target) {
     open(target);
   }
@@ -48,6 +54,7 @@ export function createLoading(props?: Partial<LoadingProps>, target?: HTMLElemen
     vm,
     close,
     open,
+    destory,
     setTip: (tip: string) => {
       data.tip = tip;
     },
diff --git a/src/components/Loading/src/useLoading.ts b/src/components/Loading/src/useLoading.ts
index 356df7de8a3..910e084e9cb 100644
--- a/src/components/Loading/src/useLoading.ts
+++ b/src/components/Loading/src/useLoading.ts
@@ -1,7 +1,8 @@
 import { unref } from 'vue';
+import type { Ref } from 'vue';
+import { tryOnUnmounted } from '@vueuse/core';
 import { createLoading } from './createLoading';
 import type { LoadingProps } from './typing';
-import type { Ref } from 'vue';
 
 export interface UseLoadingOptions {
   target?: any;
@@ -45,5 +46,9 @@ export function useLoading(
     instance.setTip(tip);
   };
 
+  tryOnUnmounted(() => {
+    instance.destory();
+  });
+
   return [open, close, setTip];
 }
diff --git a/src/directives/loading.ts b/src/directives/loading.ts
index dadb5b7d7a0..242816b5b69 100644
--- a/src/directives/loading.ts
+++ b/src/directives/loading.ts
@@ -28,7 +28,7 @@ const loadingDirective: Directive = {
     }
   },
   unmounted(el) {
-    el?.instance?.close();
+    el?.instance?.destory();
   },
 };