Sfoglia il codice sorgente

fix: auto remove script dom in `useScript`

修复useScript未能自动移除script节点的问题
无木 3 anni fa
parent
commit
a544dd3e58
2 ha cambiato i file con 9 aggiunte e 3 eliminazioni
  1. 2 1
      CHANGELOG.zh_CN.md
  2. 7 2
      src/hooks/web/useScript.ts

+ 2 - 1
CHANGELOG.zh_CN.md

@@ -5,10 +5,10 @@
 ### 🐛 Bug Fixes
 
 - **ApiTreeSelect** 修复未能正确监听`params`变化的问题
-- **BasicTable** 修复可编辑单元格不支持`ellipsis`配置的问题
 - **ImgRotateDragVerify** 修复组件`resume`方法无法调用的问题
 - **TableAction** 修复 stopButtonPropagation 属性某些情况下不起作用的问题
 - **BasicTable**
+  - 修复可编辑单元格不支持`ellipsis`配置的问题
   - 修复全屏模式下看不到子组件弹出层(popconfirm 以及 select、treeSelect 等编辑组件)的问题
   - 修复启用`expandRowByClick`时,点击不可展开的行可能会导致样式错误的问题
   - 修复`pagination`属性动态改变不生效的问题
@@ -17,6 +17,7 @@
   - 修复`Alert`组件的颜色配置
   - 修复禁用状态下的`link`类型的按钮颜色问题
   - 修复`Tree`已勾选的复选框的样式问题
+- **其它** 修复 useScript 未能自动移除 script 节点的问题
 
 ## 2.6.1(2021-07-19)
 

+ 7 - 2
src/hooks/web/useScript.ts

@@ -1,4 +1,4 @@
-import { onMounted, ref } from 'vue';
+import { onMounted, onUnmounted, ref } from 'vue';
 
 interface ScriptOptions {
   src: string;
@@ -8,10 +8,11 @@ export function useScript(opts: ScriptOptions) {
   const isLoading = ref(false);
   const error = ref(false);
   const success = ref(false);
+  let script: HTMLScriptElement;
 
   const promise = new Promise((resolve, reject) => {
     onMounted(() => {
-      const script = document.createElement('script');
+      script = document.createElement('script');
       script.type = 'text/javascript';
       script.onload = function () {
         isLoading.value = false;
@@ -32,6 +33,10 @@ export function useScript(opts: ScriptOptions) {
     });
   });
 
+  onUnmounted(() => {
+    script && script.remove();
+  });
+
   return {
     isLoading,
     error,