fix(SearchTree): 组件内部内部回调函数在闭包环境中,导致回调函数中无法拿到最新值 #593 (#603)

uiwjs · Mar 3, 2022 · 61a9651 · 61a9651
1 parent 30fc5a7
commit 61a9651
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 11 deletions.
diff --git a/packages/react-search-tree/src/SearchTagInput.tsx b/packages/react-search-tree/src/SearchTagInput.tsx
@@ -117,7 +117,7 @@ function SearchTagInput<V extends SearchTagInputOption>(props: SearchTagInputPro
       options,
     };
     return React.cloneElement(content as JSX.Element, newProps);
-  }, [selectedOption, options, emptyOption]);
+  }, [JSON.parse(JSON.stringify(selectedOption)), options, emptyOption]);
 
   return (
     <Dropdown

diff --git a/packages/react-tag/src/index.tsx b/packages/react-tag/src/index.tsx
@@ -47,19 +47,15 @@ export default (props: TagProps = {}) => {
   if (!visible) {
     return null;
   }
-  const closeBtn = useMemo(
-    () =>
-      closable ? (
-        <svg onClick={onClose} className={`${prefixCls}-close`} width="15" height="15" viewBox="0 0 16 16">
-          <path d="M9.41 8l2.29-2.29c.19-.18.3-.43.3-.71a1.003 1.003 0 0 0-1.71-.71L8 6.59l-2.29-2.3a1.003 1.003 0 0 0-1.42 1.42L6.59 8 4.3 10.29c-.19.18-.3.43-.3.71a1.003 1.003 0 0 0 1.71.71L8 9.41l2.29 2.29c.18.19.43.3.71.3a1.003 1.003 0 0 0 .71-1.71L9.41 8z" />
-        </svg>
-      ) : null,
-    [closable],
-  );
+
   return (
     <span className={cls} style={styl} {...other}>
       {title || children}
-      {closeBtn}
+      {closable ? (
+        <svg onClick={onClose} className={`${prefixCls}-close`} width="15" height="15" viewBox="0 0 16 16">
+          <path d="M9.41 8l2.29-2.29c.19-.18.3-.43.3-.71a1.003 1.003 0 0 0-1.71-.71L8 6.59l-2.29-2.3a1.003 1.003 0 0 0-1.42 1.42L6.59 8 4.3 10.29c-.19.18-.3.43-.3.71a1.003 1.003 0 0 0 1.71.71L8 9.41l2.29 2.29c.18.19.43.3.71.3a1.003 1.003 0 0 0 .71-1.71L9.41 8z" />
+        </svg>
+      ) : null}
     </span>
   );
 };