From efa264d612051f3c7fff3ecfed0e7ad9b02921ad Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@buaa.edu.cn>
Date: Thu, 20 Sep 2018 21:15:52 +0800
Subject: [PATCH] [bugfix] Field: maxlength not work when type = number (#1839)

---
 packages/field/index.vue          | 16 +++++++++++++++-
 packages/field/test/index.spec.js | 22 ++++++++++++++++++++++
 2 files changed, 37 insertions(+), 1 deletion(-)

diff --git a/packages/field/index.vue b/packages/field/index.vue
index 257fd30df..7a07797d4 100644
--- a/packages/field/index.vue
+++ b/packages/field/index.vue
@@ -105,6 +105,7 @@ export default create({
   },
 
   mounted() {
+    this.format();
     this.$nextTick(this.adjustSize);
   },
 
@@ -129,8 +130,21 @@ export default create({
       this.$refs.input && this.$refs.input.blur();
     },
 
+    // native maxlength not work when type = number
+    format(target = this.$refs.input) {
+      let { value } = target;
+      const { maxlength } = this.$attrs;
+
+      if (this.isDef(maxlength) && value.length > maxlength) {
+        value = value.slice(0, maxlength);
+        target.value = value;
+      }
+
+      return value;
+    },
+
     onInput(event) {
-      this.$emit('input', event.target.value);
+      this.$emit('input', this.format(event.target));
     },
 
     onFocus(event) {
diff --git a/packages/field/test/index.spec.js b/packages/field/test/index.spec.js
index ce554c5fe..6bb694871 100644
--- a/packages/field/test/index.spec.js
+++ b/packages/field/test/index.spec.js
@@ -109,3 +109,25 @@ test('blur method', () => {
 
   expect(fn.mock.calls.length).toEqual(1);
 });
+
+test('maxlength', async() => {
+  const wrapper = mount(Field, {
+    attrs: {
+      maxlength: 3
+    },
+    propsData: {
+      value: 1234,
+      type: 'number'
+    }
+  });
+
+  const input = wrapper.find('input');
+  expect(input.element.value).toEqual('123');
+
+  input.element.value = 1234;
+  await later();
+  input.trigger('input');
+
+  expect(input.element.value).toEqual('123');
+  expect(wrapper.emitted('input')[0][0]).toEqual('123');
+});