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 () { | ... | ... |