Commit 787ae6a963847a0b11d1972531f96b5fc1229f58
Committed by
GitHub
Merge pull request #3006 from SergioCrisostomo/fix-2984
normalise public (export) value to number of step decimal cases
Showing
1 changed file
with
16 additions
and
14 deletions
Show diff stats
src/components/slider/slider.vue
| ... | ... | @@ -5,11 +5,11 @@ |
| 5 | 5 | :min="min" |
| 6 | 6 | :max="max" |
| 7 | 7 | :step="step" |
| 8 | - :value="currentValue[0]" | |
| 8 | + :value="exportValue[0]" | |
| 9 | 9 | :disabled="disabled" |
| 10 | 10 | @on-change="handleInputChange"></Input-number> |
| 11 | 11 | <div :class="[prefixCls + '-wrap']" ref="slider" @click.self="sliderClick"> |
| 12 | - <input type="hidden" :name="name" :value="currentValue"> | |
| 12 | + <input type="hidden" :name="name" :value="exportValue"> | |
| 13 | 13 | <template v-if="showStops"> |
| 14 | 14 | <div :class="[prefixCls + '-stop']" v-for="item in stops" :style="{ 'left': item + '%' }" @click.self="sliderClick"></div> |
| 15 | 15 | </template> |
| ... | ... | @@ -19,7 +19,7 @@ |
| 19 | 19 | :style="{left: minPosition + '%'}" |
| 20 | 20 | @touchstart="onPointerDown($event, 'min')" |
| 21 | 21 | @mousedown="onPointerDown($event, 'min')"> |
| 22 | - <Tooltip :controlled="pointerDown === 'min'" placement="top" :content="tipFormat(currentValue[0])" | |
| 22 | + <Tooltip :controlled="pointerDown === 'min'" placement="top" :content="tipFormat(exportValue[0])" | |
| 23 | 23 | :disabled="tipDisabled" :always="showTip === 'always'" ref="minTooltip"> |
| 24 | 24 | <div :class="minButtonClasses"></div> |
| 25 | 25 | </Tooltip> |
| ... | ... | @@ -29,7 +29,7 @@ |
| 29 | 29 | :style="{left: maxPosition + '%'}" |
| 30 | 30 | @touchstart="onPointerDown($event, 'max')" |
| 31 | 31 | @mousedown="onPointerDown($event, 'max')"> |
| 32 | - <Tooltip :controlled="pointerDown === 'max'" placement="top" :content="tipFormat(currentValue[1])" | |
| 32 | + <Tooltip :controlled="pointerDown === 'max'" placement="top" :content="tipFormat(exportValue[1])" | |
| 33 | 33 | :disabled="tipDisabled" :always="showTip === 'always'" ref="maxTooltip"> |
| 34 | 34 | <div :class="maxButtonClasses"></div> |
| 35 | 35 | </Tooltip> |
| ... | ... | @@ -120,16 +120,16 @@ |
| 120 | 120 | this.currentValue = val; |
| 121 | 121 | } |
| 122 | 122 | }, |
| 123 | - currentValue (val) { | |
| 123 | + exportValue (values) { | |
| 124 | 124 | this.$nextTick(() => { |
| 125 | 125 | this.$refs.minTooltip.updatePopper(); |
| 126 | 126 | if (this.range) { |
| 127 | 127 | this.$refs.maxTooltip.updatePopper(); |
| 128 | 128 | } |
| 129 | 129 | }); |
| 130 | - const exportValue = this.range ? val : val[0]; | |
| 131 | - this.$emit('input', exportValue); | |
| 132 | - this.$emit('on-input', exportValue); | |
| 130 | + const value = this.range ? values : values[0]; | |
| 131 | + this.$emit('input', value); | |
| 132 | + this.$emit('on-input', value); | |
| 133 | 133 | } |
| 134 | 134 | }, |
| 135 | 135 | computed: { |
| ... | ... | @@ -159,6 +159,10 @@ |
| 159 | 159 | } |
| 160 | 160 | ]; |
| 161 | 161 | }, |
| 162 | + exportValue(){ | |
| 163 | + const decimalCases = (String(this.step).split('.')[1] || '').length; | |
| 164 | + return this.currentValue.map(nr => Number(nr.toFixed(decimalCases))); | |
| 165 | + }, | |
| 162 | 166 | minPosition () { |
| 163 | 167 | const val = this.currentValue; |
| 164 | 168 | return (val[0] - this.min) / this.valueRange * 100; |
| ... | ... | @@ -269,9 +273,9 @@ |
| 269 | 273 | }, |
| 270 | 274 | |
| 271 | 275 | emitChange(){ |
| 272 | - const exportValue = this.range ? this.currentValue : this.currentValue[0]; | |
| 273 | - this.$emit('on-change', exportValue); | |
| 274 | - this.dispatch('FormItem', 'on-form-change', exportValue); | |
| 276 | + const value = this.range ? this.exportValue : this.exportValue[0]; | |
| 277 | + this.$emit('on-change', value); | |
| 278 | + this.dispatch('FormItem', 'on-form-change', value); | |
| 275 | 279 | }, |
| 276 | 280 | |
| 277 | 281 | sliderClick (event) { |
| ... | ... | @@ -287,9 +291,7 @@ |
| 287 | 291 | |
| 288 | 292 | handleInputChange (val) { |
| 289 | 293 | this.currentValue = [val, this.currentValue[1]]; |
| 290 | - const exportValue = this.range ? this.currentValue : this.currentValue[0]; | |
| 291 | - this.$emit('on-change', exportValue); | |
| 292 | - this.dispatch('FormItem', 'on-form-change', exportValue); | |
| 294 | + this.emitChange(); | |
| 293 | 295 | }, |
| 294 | 296 | }, |
| 295 | 297 | mounted () { | ... | ... |