ソースを参照

feat: slider add change event

richard1015 5 年 前
コミット
4a11528fa2

+ 6 - 2
src/packages/slider/demo.vue

@@ -7,7 +7,7 @@
     <div>
       <nut-cell>
         <span slot="title">
-          <nut-slider v-model="val1" :range="[0, 10]"></nut-slider>
+          <nut-slider v-model="val1" @change="changeFn($event)" :range="[0, 10]"></nut-slider>
         </span>
       </nut-cell>
       <nut-cell>
@@ -84,7 +84,11 @@ export default {
       val6: 0
     };
   },
-  methods: {}
+  methods: {
+    changeFn(event) {
+      console.log(event);
+    }
+  }
 };
 </script>
 

+ 7 - 0
src/packages/slider/doc.md

@@ -80,3 +80,10 @@
 | showLabelAlways | 是否一直展示标签 | Boolean | false
 | showRangeTxt | 两端是否展示可选取范围 | Boolean | false
 | stage | 分段数 | Number/String | -
+
+## Event
+
+| 名称 | 说明 | 回调参数 
+|----- | ----- | ----- 
+| change | 滑动时触发函数 | value
+

+ 1 - 0
src/packages/slider/slider.vue

@@ -97,6 +97,7 @@ export default {
     setVal(posi) {
       const trans = (posi / this.box.clientWidth) * this.total;
       this.current = Math.round(trans / this.cell) * this.cell + this.range[0];
+      this.$emit('change', this.current);
       this.$emit('input', this.current);
     },
     valToPosi() {