fix: 修复picker组件输入框无法foucs的交互

baidu · Dec 12, 2024 · 021e4b4 · 021e4b4
1 parent ae8db60
commit 021e4b4
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 7 deletions.
diff --git a/packages/amis/__tests__/renderers/__snapshots__/Picker.test.tsx.snap b/packages/amis/__tests__/renderers/__snapshots__/Picker.test.tsx.snap
@@ -28,10 +28,10 @@ exports[`1. Renderer:Picker base 1`] = `
         class="cxd-PickerControl cxd-Form-control"
       >
         <div
-          class="cxd-Picker cxd-Picker--single is-focused"
+          class="cxd-Picker cxd-Picker--single"
         >
           <div
-            class="cxd-Picker-input is-focused"
+            class="cxd-Picker-input"
           >
             <div
               class="cxd-Picker-placeholder"
@@ -258,10 +258,10 @@ exports[`1. Renderer:Picker base 2`] = `
       class="cxd-PickerControl cxd-Form-control"
     >
       <div
-        class="cxd-Picker cxd-Picker--single is-focused"
+        class="cxd-Picker cxd-Picker--single"
       >
         <div
-          class="cxd-Picker-input is-focused"
+          class="cxd-Picker-input"
         >
           <div
             class="cxd-Picker-valueWrap"

diff --git a/packages/amis/src/renderers/Form/Picker.tsx b/packages/amis/src/renderers/Form/Picker.tsx
@@ -456,7 +456,9 @@ export default class PickerControl extends React.PureComponent<
   }
 
   @autobind
-  handleFocus() {
+  handleFocus(e: React.MouseEvent<HTMLElement>) {
+    this.input.current && this.input.current.focus();
+    e.stopPropagation();
     this.setState({
       isFocused: true
     });
@@ -471,7 +473,6 @@ export default class PickerControl extends React.PureComponent<
 
   @autobind
   handleClick() {
-    this.input.current && this.input.current.focus();
     this.open();
   }
 
@@ -816,7 +817,7 @@ export default class PickerControl extends React.PureComponent<
                   value={''}
                   ref={this.input}
                   onKeyDown={this.handleKeyDown}
-                  onFocus={this.handleFocus}
+                  onClick={this.handleFocus}
                   onBlur={this.handleBlur}
                   readOnly={mobileUI}
                 />