fix: datePicker focus and blur are executed at the same time vueCompo…

…nent#4884
13476075014 · Feb 27, 2024 · fd5b201 · fd5b201
1 parent 7c1a14b
commit fd5b201
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/components/date-picker/createPicker.js b/components/date-picker/createPicker.js
@@ -192,6 +192,8 @@ export default function createPicker(TheCalendar, props) {
           inputReadOnly,
         },
         on: {
+          handleFocus: focus,
+          handleBlur: blur,
           ok,
           panelChange,
           change: this.handleCalendarChange,
@@ -225,8 +227,6 @@ export default function createPicker(TheCalendar, props) {
           <input
             ref="input"
             disabled={props.disabled}
-            onFocus={focus}
-            onBlur={blur}
             readOnly
             value={formatDate(inputValue, this.format)}
             placeholder={placeholder}

diff --git a/components/vc-calendar/src/Calendar.jsx b/components/vc-calendar/src/Calendar.jsx
@@ -311,6 +311,8 @@ const Calendar = {
         onSelect={this.onDateInputSelect}
         inputMode={inputMode}
         inputReadOnly={inputReadOnly}
+        onFocus={() => this.__emit('handleFocus')}
+        onBlur={() => this.__emit('handleBlur')}
       />
     ) : null;
     const children = [];

diff --git a/components/vc-calendar/src/date/DateInput.jsx b/components/vc-calendar/src/date/DateInput.jsx
@@ -141,12 +141,14 @@ const DateInput = {
     },
     onFocus() {
       this.setState({ hasFocus: true });
+      this.__emit('focus');
     },
     onBlur() {
       this.setState((prevState, prevProps) => ({
         hasFocus: false,
         str: formatDate(prevProps.value, prevProps.format),
       }));
+      this.__emit('blur');
     },
     onKeyDown(event) {
       const { keyCode } = event;