Skip to content

Commit dcf5b99

Browse files
author
LeeSSHH
committed
fix: The Enter key lock cannot be released correctly when the custom input calls blur().
1 parent 4779fb8 commit dcf5b99

File tree

2 files changed

+14
-5
lines changed

2 files changed

+14
-5
lines changed

src/BaseSelect/index.tsx

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -535,13 +535,13 @@ const BaseSelect = React.forwardRef<BaseSelectRef, BaseSelectProps>((props, ref)
535535
}
536536

537537
if (mergedOpen && (!isEnterKey || !keyLockRef.current)) {
538+
// Lock the Enter key after it is pressed to avoid repeated triggering of the onChange event.
539+
if (isEnterKey) {
540+
keyLockRef.current = true;
541+
}
538542
listRef.current?.onKeyDown(event, ...rest);
539543
}
540544

541-
if (isEnterKey) {
542-
keyLockRef.current = true;
543-
}
544-
545545
onKeyDown?.(event, ...rest);
546546
};
547547

@@ -566,6 +566,11 @@ const BaseSelect = React.forwardRef<BaseSelectRef, BaseSelectProps>((props, ref)
566566
});
567567
};
568568

569+
const onSelectorBlur = () => {
570+
// Unlock the Enter key after the selector blur; otherwise, the Enter key needs to be pressed twice to trigger the correct effect.
571+
keyLockRef.current = false;
572+
};
573+
569574
// ========================== Focus / Blur ==========================
570575
/** Record real focus status */
571576
const focusRef = React.useRef<boolean>(false);
@@ -813,6 +818,7 @@ const BaseSelect = React.forwardRef<BaseSelectRef, BaseSelectProps>((props, ref)
813818
onSearchSubmit={onInternalSearchSubmit}
814819
onRemove={onSelectorRemove}
815820
tokenWithEnter={tokenWithEnter}
821+
onSelectorBlur={onSelectorBlur}
816822
/>
817823
)}
818824
</SelectTrigger>

src/Selector/index.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,8 @@ export interface SelectorProps {
9292
onSearchSubmit?: (searchText: string) => void;
9393
onRemove: (value: DisplayValueType) => void;
9494
onInputKeyDown?: React.KeyboardEventHandler<HTMLInputElement | HTMLTextAreaElement>;
95-
95+
// on selector blur
96+
onSelectorBlur?: () => void;
9697
/**
9798
* @private get real dom for trigger align.
9899
* This may be removed after React provides replacement of `findDOMNode`
@@ -119,6 +120,7 @@ const Selector: React.ForwardRefRenderFunction<RefSelectorProps, SelectorProps>
119120
onSearchSubmit,
120121
onToggleOpen,
121122
onInputKeyDown,
123+
onSelectorBlur,
122124

123125
domRef,
124126
} = props;
@@ -285,6 +287,7 @@ const Selector: React.ForwardRefRenderFunction<RefSelectorProps, SelectorProps>
285287
className={`${prefixCls}-selector`}
286288
onClick={onClick}
287289
onMouseDown={onMouseDown}
290+
onBlur={onSelectorBlur}
288291
>
289292
{prefix && <div className={`${prefixCls}-prefix`}>{prefix}</div>}
290293
{selectNode}

0 commit comments

Comments
 (0)