feat(NumberKeyboard): add blur-on-close prop (#8033)

src/number-keyboard/README.md

@@ -173,6 +173,7 @@ export default {
 | delete-button-text | Delete button text | _string_ | Delete Icon |
 | close-button-loading | Whether to show loading close button in custom theme | _boolean_ | `false` |
 | show-delete-key | Whether to show delete button | _boolean_ | `true` |
+| blur-on-close `v3.0.6` | Whether to emit blur event when clicking close button | _boolean_ | `true` |
 | hide-on-click-outside | Whether to hide keyboard when outside is clicked | _boolean_ | `true` |
 | teleport | Return the mount node for NumberKeyboard | _string \| Element_ | - |
 | safe-area-inset-bottom | Whether to enable bottom safe area adaptation | _boolean_ | `true` |

src/number-keyboard/README.zh-CN.md

@@ -184,7 +184,8 @@ export default {
 | delete-button-text | 删除按钮文字，空则展示删除图标 | _string_ | - |
 | close-button-loading | 是否将关闭按钮设置为加载中状态，仅在 `theme="custom"` 时有效 | _boolean_ | `false` |
 | show-delete-key | 是否展示删除图标 | _boolean_ | `true` |
-| hide-on-click-outside | 点击外部时是否收起键盘 | _boolean_ | `true` |
+| blur-on-close `v3.0.6` | 是否在点击关闭按钮时触发 blur 事件 | _boolean_ | `true` |
+| hide-on-click-outside | 是否在点击外部时收起键盘 | _boolean_ | `true` |
 | teleport | 指定挂载的节点，[用法示例](#/zh-CN/popup#zhi-ding-gua-zai-wei-zhi) | _string \| Element_ | - |
 | safe-area-inset-bottom | 是否开启[底部安全区适配](#/zh-CN/advanced-usage#di-bu-an-quan-qu-gua-pei) | _boolean_ | `true` |
 | random-key-order | 是否将通过随机顺序展示按键 | _boolean_ | `false` |

src/number-keyboard/index.js

@@ -35,6 +35,10 @@ export default createComponent({
       type: Boolean,
       default: true,
     },
+    blurOnClose: {
+      type: Boolean,
+      default: true,
+    },
     showDeleteKey: {
       type: Boolean,
       default: true,
@@ -118,7 +122,10 @@ export default createComponent({
 
     const onClose = () => {
       emit('close');
+
+      if (props.blurOnClose) {
         onBlur();
+      }
     };
 
     const onAnimationEnd = () => {

src/number-keyboard/test/index.spec.js

@@ -39,10 +39,13 @@ test('should should emit blur event when hidden', () => {
 test('should emit close event after clicking close button', () => {
   const wrapper = mount(NumberKeyboard, {
     props: {
+      show: true,
       theme: 'custom',
     },
   });
+
   clickKey(wrapper.findAll('.van-key')[12]);
+  expect(wrapper.emitted('blur')).toBeTruthy();
   expect(wrapper.emitted('close')).toBeTruthy();
 });
 
@@ -230,3 +233,16 @@ test('should shuffle key order when using random-key-order prop', () => {
 
   expect(keys.every((v, k) => keys[k] === clickKeys[k])).toEqual(false);
 });
+
+test('should not emit close event after clicking close button when blur-on-close is false', () => {
+  const wrapper = mount(NumberKeyboard, {
+    props: {
+      show: true,
+      theme: 'custom',
+      blurOnClose: false,
+    },
+  });
+
+  clickKey(wrapper.findAll('.van-key')[12]);
+  expect(wrapper.emitted('blur')).toBeFalsy();
+});