fix(ui): fix bug of useTwoWayBinding

DevCloudFE · Dec 17, 2021 · 6767097 · 6767097
1 parent 44f557d
commit 6767097
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 11 deletions.
diff --git a/packages/ui/src/hooks/two-way-binding.ts b/packages/ui/src/hooks/two-way-binding.ts
@@ -1,7 +1,7 @@
 import type { Updater } from './immer';
 
 import { isEqual } from 'lodash';
-import { useCallback, useMemo } from 'react';
+import { useCallback } from 'react';
 
 import { DFormItemContext } from '../components/form';
 import { useCustomContext } from './context';
@@ -25,16 +25,13 @@ export function useTwoWayBinding<T>(
   const [autoValue, setAutoValue] = useImmer<T>(initialValue);
   const value = input?.[0] ?? autoValue;
 
-  const dataRef = useMemo(() => {
-    return { current: formControlEnable ? (formControlValue as T) : value };
-  }, [formControlEnable, formControlValue, value]);
+  const currentValue = formControlEnable ? (formControlValue as T) : value;
 
   const changeValue = useCallback(
     (val: T) => {
       if (formControlEnable) {
         if (formControlName) {
-          if (!isEqual(val, dataRef.current)) {
-            dataRef.current = val;
+          if (!isEqual(val, currentValue)) {
             onFormControlValueChange?.(val, formControlName);
           }
         } else {
@@ -43,14 +40,13 @@ export function useTwoWayBinding<T>(
       } else {
         setValue?.(val);
         setAutoValue(val);
-        if (!isEqual(val, dataRef.current)) {
-          dataRef.current = val;
+        if (!isEqual(val, currentValue)) {
           onValueChange?.(val);
         }
       }
     },
-    [dataRef, formControlEnable, formControlName, onFormControlValueChange, onValueChange, setAutoValue, setValue]
+    [currentValue, formControlEnable, formControlName, onFormControlValueChange, onValueChange, setAutoValue, setValue]
   );
 
-  return [dataRef.current, changeValue];
+  return [currentValue, changeValue];
 }
diff --git a/packages/ui/src/styles/components/_dropdown.scss b/packages/ui/src/styles/components/_dropdown.scss
@@ -31,6 +31,7 @@ $dropdown-item-height: 32px;
   }
 
   @include e(title) {
+    flex-grow: 1;
     flex-shrink: 0;
 
     @include utils-ellipsis;

diff --git a/packages/ui/src/styles/components/_tabs.scss b/packages/ui/src/styles/components/_tabs.scss
@@ -463,9 +463,11 @@
   @include utils-disabled;
 
   @include m(dropdown) {
-    width: 100%;
+    display: flex;
     height: 100%;
 
+    line-height: 22px;
+
     @include e(close) {
       margin-left: auto;
     }