Commit 23f1a8f28ba4af6857c59a16fda2737ada9f87a1

Authored by Aresn
Committed by GitHub
2 parents e93f1e9a 8a76ba04

Merge pull request #166 from jingsam/slider

add slider on-input
Showing 2 changed files with 18 additions and 14 deletions   Show diff stats
src/components/slider/slider.vue
@@ -184,6 +184,7 @@ @@ -184,6 +184,7 @@
184 } 184 }
185 }); 185 });
186 this.updateValue(val); 186 this.updateValue(val);
  187 + this.$emit('on-input', this.value);
187 } 188 }
188 }, 189 },
189 methods: { 190 methods: {
test/routers/slider.vue
1 <template> 1 <template>
2 <div style="width: 140px;margin:100px;"> 2 <div style="width: 140px;margin:100px;">
3 - <!--{{ value }}-->  
4 - <!--<Slider @on-change="change" :step="15"></Slider>-->  
5 - <!--<Slider :value="40" :tip-format="format"></Slider>-->  
6 - <!--<Slider :value.sync="value" show-input show-stops range @on-change="change" :step="13"></Slider>-->  
7 - <!--<Slider :max="10"></Slider>-->  
8 - <!--<Slider :step="13"></Slider>-->  
9 - <!--<Slider :step="13" :max="60"></Slider>-->  
10 - <!--<Icon type="checkmark-circled" size="40" color="#f60"></Icon>-->  
11 - <!--<p>附近的首付款是东方红看就是</p>-->  
12 - <!--<div class="ivu-article">-->  
13 - <!--<a href="http://www.iviewui.com" target="_blank">iView</a>-->  
14 - <!--</div>--> 3 + {{ value }}
  4 + <Slider @on-change="change" @on-input="input" :step="15"></Slider>
  5 + <Slider :value="40" :tip-format="format"></Slider>
  6 + <Slider :value.sync="value" show-input show-stops range @on-change="change" @on-input="input" :step="13"></Slider>
  7 + <Slider :max="10"></Slider>
  8 + <Slider :step="13"></Slider>
  9 + <Slider :step="13" :max="60"></Slider>
  10 + <Icon type="checkmark-circled" size="40" color="#f60"></Icon>
  11 + <p>附近的首付款是东方红看就是</p>
  12 + <div class="ivu-article">
  13 + <a href="http://www.iviewui.com" target="_blank">iView</a>
  14 + </div>
15 <Slider :value="75"></Slider> 15 <Slider :value="75"></Slider>
16 - <!--<Slider :value="[20, 50]" range></Slider>--> 16 + <Slider :value="[20, 50]" range></Slider>
17 </div> 17 </div>
18 </template> 18 </template>
19 <script> 19 <script>
@@ -31,7 +31,10 @@ @@ -31,7 +31,10 @@
31 return `进度:${val}%` 31 return `进度:${val}%`
32 }, 32 },
33 change (data) { 33 change (data) {
34 -// console.log(data) 34 + console.log(data)
  35 + },
  36 + input (value) {
  37 + console.log(value)
35 } 38 }
36 } 39 }
37 } 40 }