[bugfix] Slider: should not emit change event when value not changed (#4087)

src/slider/README.md

@@ -105,7 +105,8 @@ export default {
 
 | Event | Description | Arguments |
 |------|------|------|
-| change | Triggered after value change | value: current rate |
+| input | Instant triggered when value changed | value: current rate |
+| change | Triggered after value changed | value: current rate |
 | drag-start | Triggered when start drag | - |
 | drag-end | Triggered when end drag | - |
 

src/slider/README.zh-CN.md

@@ -107,7 +107,8 @@ Slider 垂直展示时，高度为 100% 父元素高度
 
 | 事件名 | 说明 | 回调参数 |
 |------|------|------|
-| change | 进度值改变后触发 | value: 当前进度 |
+| input | 进度变化时实时触发 | value: 当前进度 |
+| change | 进度变化且结束拖动后触发 | value: 当前进度 |
 | drag-start | 开始拖动时触发 | - |
 | drag-end | 结束拖动时触发 | - |
 

src/slider/index.js

@@ -96,14 +96,18 @@ export default createComponent({
       const total = this.vertical ? rect.height : rect.width;
       const value = (delta / total) * this.range + this.min;
 
+      this.startValue = this.value;
       this.updateValue(value, true);
     },
 
     updateValue(value, end) {
       value = this.format(value);
-      this.$emit('input', value);
 
-      if (end) {
+      if (value !== this.value) {
+        this.$emit('input', value);
+      }
+
+      if (end && value !== this.startValue) {
         this.$emit('change', value);
       }
     },

src/slider/test/index.spec.js

@@ -116,3 +116,21 @@ it('bar height', () => {
 
   expect(wrapper).toMatchSnapshot();
 });
+
+it('should not emit change event when value not changed', () => {
+  const wrapper = mount(Slider, {
+    propsData: {
+      value: 50
+    },
+    listeners: {
+      input(value) {
+        wrapper.setProps({ value });
+      }
+    }
+  });
+
+  trigger(wrapper, 'click', 100, 0);
+  trigger(wrapper, 'click', 100, 0);
+
+  expect(wrapper.emitted('change').length).toEqual(1);
+});