drip-public/iview
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixed #2852

Browse source
This commit is contained in:
梁灏 2018-01-23 18:14:23 +08:00
parent feb21a0a16
commit 2eccfc9938
3 changed files with 74 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

82
examples/routers/slider.vue
View file

@ -1,40 +1,68 @@
<template>
<div style="margin: 0 400px;">
<Slider v-model="valueSingle" @on-change="updateSingleDisplayValue"></Slider>
<Button @click="randomSingle">change</Button> {{singleDisplayValue}}
<!--<template>-->
<!--<div style="margin: 0 400px;">-->
<!--<Slider v-model="valueSingle" @on-change="updateSingleDisplayValue"></Slider>-->
<!--<Button @click="randomSingle">change</Button> {{singleDisplayValue}}-->
<Slider v-model="valueRange" range @on-change="updateRangeDisplayValue"></Slider>
<Button @click="randomRange">change</Button> {{rangeDisplayValue}}
<!--<Slider v-model="valueRange" range @on-change="updateRangeDisplayValue"></Slider>-->
<!--<Button @click="randomRange">change</Button> {{rangeDisplayValue}}-->
<!--</div>-->
<!--</template>-->
<!--<script>-->
<!--export default {-->
<!--data () {-->
<!--return {-->
<!--valueSingle: 10,-->
<!--valueRange: [20, 50],-->
<!--singleDisplayValue: 10,-->
<!--rangeDisplayValue: [20, 50]-->
<!--};-->
<!--},-->
<!--methods: {-->
<!--updateSingleDisplayValue (val){-->
<!--console.log('updateSingleDisplayValue', val);-->
<!--this.singleDisplayValue = val;-->
<!--},-->
<!--updateRangeDisplayValue (val){-->
<!--console.log('updateRangeDisplayValue', val);-->
<!--this.rangeDisplayValue = val.join(' - ');-->
<!--},-->
<!--randomSingle () {-->
<!--this.valueSingle = this.random(0, 100);-->
<!--},-->
<!--randomRange () {-->
<!--this.valueRange = [this.random(0, 50), this.random(50, 100)];-->
<!--},-->
<!--random (min, max){-->
<!--return Math.round(Math.random() * (max - min)) + min;-->
<!--}-->
<!--}-->
<!--};-->
<!--</script>-->
<template>
<div>
<Button type="primary" @click="modal1 = true">Display dialog box</Button>
<Modal v-model="modal1">
<Slider v-model="value2" range show-tip="always"></Slider>
</Modal>
</div>
</template>
<script>
export default {
data () {
return {
valueSingle: 10,
valueRange: [20, 50],
singleDisplayValue: 10,
rangeDisplayValue: [20, 50]
};
modal1: false,
value2: [20, 50],
}
},
methods: {
updateSingleDisplayValue (val){
console.log('updateSingleDisplayValue', val);
this.singleDisplayValue = val;
ok () {
this.$Message.info('Clicked ok');
},
updateRangeDisplayValue (val){
console.log('updateRangeDisplayValue', val);
this.rangeDisplayValue = val.join(' - ');
},
randomSingle () {
this.valueSingle = this.random(0, 100);
},
randomRange () {
this.valueRange = [this.random(0, 50), this.random(50, 100)];
},
random (min, max){
return Math.round(Math.random() * (max - min)) + min;
cancel () {
this.$Message.info('Clicked cancel');
}
}
};
}
</script>