fix input-number change event

packages/input-number/src/input-number.vue

@@ -21,10 +21,11 @@
     >
     </span>
     <el-input
-      v-model.number="currentValue"
+      :value="currentValue"
       @keydown.up.native="increase"
       @keydown.down.native="decrease"
       @blur="handleBlur"
+      @input="handleInput"
       :disabled="disabled"
       :size="size"
       :max="max"
@@ -111,16 +112,10 @@
       };
     },
     watch: {
-      value(val) {
-        this.currentValue = val;
-      },
-
-      currentValue(newVal, oldVal) {
-        if (newVal <= this.max && newVal >= this.min) {
-          this.$emit('change', newVal, oldVal);
-          this.$emit('input', newVal);
-        } else {
-          this.currentValue = oldVal;
+      value(value) {
+        const newVal = Number(value);
+        if (!isNaN(newVal) && newVal <= this.max && newVal >= this.min) {
+          this.currentValue = newVal;
         }
       }
     },
@@ -169,17 +164,31 @@
         const value = this.value || 0;
         const newVal = this._increase(value, this.step);
         if (newVal > this.max) return;
-        this.currentValue = newVal;
+        this.setCurrentValue(newVal);
       },
       decrease() {
         if (this.disabled || this.minDisabled) return;
         const value = this.value || 0;
         const newVal = this._decrease(value, this.step);
         if (newVal < this.min) return;
-        this.currentValue = newVal;
+        this.setCurrentValue(newVal);
       },
       handleBlur() {
         this.$refs.input.setCurrentValue(this.currentValue);
+      },
+      setCurrentValue(newVal) {
+        const oldVal = this.currentValue;
+        if (newVal <= this.max && newVal >= this.min && oldVal !== newVal) {
+          this.$emit('change', newVal, oldVal);
+          this.$emit('input', newVal);
+          this.currentValue = newVal;
+        }
+      },
+      handleInput(value) {
+        const newVal = Number(value);
+        if (!isNaN(newVal)) {
+          this.setCurrentValue(newVal);
+        }
       }
     }
   };

test/unit/specs/input-number.spec.js

@@ -237,7 +237,7 @@ describe('InputNumber', () => {
   it('invalid value reset', done => {
     vm = createVue({
       template: `
-        <el-input-number v-model="value" :min="5" :max="10">
+        <el-input-number v-model="value" :min="5" :max="10" ref="inputNumber">
         </el-input-number>
       `,
       data() {
@@ -246,18 +246,18 @@ describe('InputNumber', () => {
         };
       }
     }, true);
-
+    const inputNumber = vm.$refs.inputNumber;
     vm.value = 100;
     vm.$nextTick(_ => {
-      expect(vm.value).to.be.equal(5);
+      expect(inputNumber.currentValue).to.be.equal(5);
       vm.value = 4;
 
       vm.$nextTick(_ => {
-        expect(vm.value).to.be.equal(5);
+        expect(inputNumber.currentValue).to.be.equal(5);
         vm.value = 'dsajkhd';
 
         vm.$nextTick(_ => {
-          expect(vm.value).to.be.equal(5);
+          expect(inputNumber.currentValue).to.be.equal(5);
           done();
         });
       });

test/unit/specs/slider.spec.js

@@ -176,7 +176,7 @@ describe('Slider', () => {
     setTimeout(() => {
       triggerEvent(vm.$el.querySelector('.el-input-number'), 'keyup');
       const inputNumber = vm.$el.querySelector('.el-input-number').__vue__;
-      inputNumber.currentValue = 40;
+      inputNumber.setCurrentValue(40);
       setTimeout(() => {
         expect(vm.value).to.equal(40);
         done();