diff --git a/packages/number-keyboard/demo/index.vue b/packages/number-keyboard/demo/index.vue
index ccf1a1a35..e51508b4f 100644
--- a/packages/number-keyboard/demo/index.vue
+++ b/packages/number-keyboard/demo/index.vue
@@ -51,7 +51,7 @@
diff --git a/packages/number-keyboard/en-US.md b/packages/number-keyboard/en-US.md
index fd3fd8262..9457fbe65 100644
--- a/packages/number-keyboard/en-US.md
+++ b/packages/number-keyboard/en-US.md
@@ -72,6 +72,7 @@ export default {
```
@@ -97,6 +98,7 @@ export default {
| show | Whether to show keyboard | `Boolean` | - |
| theme | Keyboard theme,can be set to `default` `custom` | `String` | `default` |
| title | Keyboard title | `String` | - |
+| maxlength | Value maxlength | `Number | String` | - |
| transition | Whether to show transition animation | `Boolean` | `true` |
| z-index | Keyboard z-index | `Number` | `100` |
| extra-key | Content of bottom left key | `String` | `''` |
diff --git a/packages/number-keyboard/index.js b/packages/number-keyboard/index.js
index a3b2984ff..a7ff5bc0f 100644
--- a/packages/number-keyboard/index.js
+++ b/packages/number-keyboard/index.js
@@ -38,6 +38,10 @@ export default sfc({
type: String,
default: ''
},
+ maxlength: {
+ type: [Number, String],
+ default: Number.MAX_VALUE
+ },
zIndex: {
type: Number,
default: 100
@@ -118,7 +122,7 @@ export default sfc({
this.$emit('update:value', value.slice(0, value.length - 1));
} else if (type === 'close') {
this.onClose();
- } else {
+ } else if (value.length < this.maxlength) {
this.$emit('input', text);
this.$emit('update:value', value + text);
}
diff --git a/packages/number-keyboard/test/__snapshots__/demo.spec.js.snap b/packages/number-keyboard/test/__snapshots__/demo.spec.js.snap
index 5efc919b4..ea371205b 100644
--- a/packages/number-keyboard/test/__snapshots__/demo.spec.js.snap
+++ b/packages/number-keyboard/test/__snapshots__/demo.spec.js.snap
@@ -25,7 +25,6 @@ exports[`renders demo correctly 1`] = `
diff --git a/packages/number-keyboard/test/index.spec.js b/packages/number-keyboard/test/index.spec.js
index e0401a22e..4b3abda6f 100644
--- a/packages/number-keyboard/test/index.spec.js
+++ b/packages/number-keyboard/test/index.spec.js
@@ -127,7 +127,7 @@ test('focus on key', () => {
expect(wrapper).toMatchSnapshot();
});
-test('controlled mode', () => {
+test('bind value', () => {
const wrapper = mount(NumberKeyboard, {
propsData: {
value: ''
@@ -148,3 +148,26 @@ test('controlled mode', () => {
keys.at(11).trigger('click');
expect(wrapper.vm.value).toEqual('1');
});
+
+test('maxlength', () => {
+ const onInput = jest.fn();
+ const wrapper = mount(NumberKeyboard, {
+ propsData: {
+ value: '',
+ maxlength: 1
+ },
+ listeners: {
+ input: onInput,
+ 'update:value': value => {
+ wrapper.setProps({ value });
+ }
+ }
+ });
+
+ const keys = wrapper.findAll('.van-key');
+ keys.at(0).trigger('click');
+ keys.at(1).trigger('click');
+
+ expect(wrapper.vm.value).toEqual('1');
+ expect(onInput).toHaveBeenCalledTimes(1);
+});
diff --git a/packages/number-keyboard/zh-CN.md b/packages/number-keyboard/zh-CN.md
index 3e2714853..f64f49ecf 100644
--- a/packages/number-keyboard/zh-CN.md
+++ b/packages/number-keyboard/zh-CN.md
@@ -75,6 +75,7 @@ export default {
```
@@ -100,6 +101,7 @@ export default {
| show | 是否显示键盘 | `Boolean` | - | - |
| theme | 样式风格,可选值为 `default` `custom` | `String` | `default` | - |
| title | 键盘标题 | `String` | - | - |
+| maxlength | 输入值最大长度 | `Number | String` | - | 2.0.2 |
| transition | 是否开启过场动画 | `Boolean` | `true` | - |
| z-index | 键盘 z-index | `Number` | `100` | - |
| extra-key | 左下角按键内容 | `String` | `''` | - |