Commit ab3ff750a394b214b8079aabed2819335f4d73d5
Committed by
GitHub
Merge pull request #3070 from SergioCrisostomo/datepicker
Pass Strings to @on-change and Dates to v-model
Showing
2 changed files
with
17 additions
and
11 deletions
Show diff stats
src/components/date-picker/picker.vue
... | ... | @@ -178,7 +178,7 @@ |
178 | 178 | }; |
179 | 179 | }, |
180 | 180 | computed: { |
181 | - publicValue(){ | |
181 | + publicVModelValue(){ | |
182 | 182 | if (this.multiple){ |
183 | 183 | return this.internalValue.slice(); |
184 | 184 | } else { |
... | ... | @@ -189,6 +189,11 @@ |
189 | 189 | return (isRange || this.multiple) ? val : val[0]; |
190 | 190 | } |
191 | 191 | }, |
192 | + publicStringValue(){ | |
193 | + const {formatDate, publicVModelValue, type} = this; | |
194 | + if (type.match(/^time/)) return publicVModelValue; | |
195 | + return Array.isArray(publicVModelValue) ? publicVModelValue.map(formatDate) : formatDate(publicVModelValue); | |
196 | + }, | |
192 | 197 | opened () { |
193 | 198 | return this.open === null ? this.visible : this.open; |
194 | 199 | }, |
... | ... | @@ -296,8 +301,8 @@ |
296 | 301 | }, |
297 | 302 | emitChange () { |
298 | 303 | this.$nextTick(() => { |
299 | - this.$emit('on-change', this.publicValue); | |
300 | - this.dispatch('FormItem', 'on-form-change', this.publicValue); | |
304 | + this.$emit('on-change', this.publicStringValue); | |
305 | + this.dispatch('FormItem', 'on-form-change', this.publicStringValue); | |
301 | 306 | }); |
302 | 307 | }, |
303 | 308 | parseDate(val) { |
... | ... | @@ -388,7 +393,7 @@ |
388 | 393 | type(type){ |
389 | 394 | this.onSelectionModeChange(type); |
390 | 395 | }, |
391 | - publicValue(now, before){ | |
396 | + publicVModelValue(now, before){ | |
392 | 397 | const newValue = JSON.stringify(now); |
393 | 398 | const oldValue = JSON.stringify(before); |
394 | 399 | const shouldEmitInput = newValue !== oldValue || typeof now !== typeof before; |
... | ... | @@ -397,9 +402,9 @@ |
397 | 402 | }, |
398 | 403 | mounted () { |
399 | 404 | const initialValue = this.value; |
400 | - const parsedValue = this.publicValue; | |
405 | + const parsedValue = this.publicVModelValue; | |
401 | 406 | if (typeof initialValue !== typeof parsedValue || JSON.stringify(initialValue) !== JSON.stringify(parsedValue)){ |
402 | - this.$emit('input', this.publicValue); // to update v-model | |
407 | + this.$emit('input', this.publicVModelValue); // to update v-model | |
403 | 408 | } |
404 | 409 | if (this.open !== null) this.visible = this.open; |
405 | 410 | } | ... | ... |
test/unit/specs/date-picker.spec.js
... | ... | @@ -80,12 +80,13 @@ describe('DatePicker.vue', () => { |
80 | 80 | |
81 | 81 | vm.$nextTick(() => { |
82 | 82 | // DATE |
83 | - expect(dateValue instanceof Date).to.equal(true); | |
84 | - expect(dateToString(dateValue)).to.equal(nowDate); | |
83 | + expect(typeof dateValue).to.equal('string'); | |
84 | + expect(dateValue).to.equal(nowDate); | |
85 | 85 | // DATERANGE |
86 | 86 | expect(Array.isArray(dateRangeValue)).to.equal(true); |
87 | - expect(dateToString(dateRangeValue[0])).to.equal(nowDate); | |
88 | - expect(dateToString(dateRangeValue[1])).to.equal(dateToString(nextWeek)); | |
87 | + expect(dateRangeValue[0]).to.equal(nowDate); | |
88 | + expect(dateRangeValue[1]).to.equal(dateToString(nextWeek)); | |
89 | + | |
89 | 90 | // TIME |
90 | 91 | expect(typeof timeValue).to.equal('string'); |
91 | 92 | expect(timeValue).to.equal(nowTime); |
... | ... | @@ -339,7 +340,7 @@ describe('DatePicker.vue', () => { |
339 | 340 | expect(value2[1] instanceof Date).to.equal(true); |
340 | 341 | expect(value2.map(dateToString).join('|')).to.equal([new Date(), new Date()].map(dateToString).join('|')); |
341 | 342 | |
342 | - expect(dateToString(vm.value3)).to.equal('2017-10-10'); | |
343 | + expect(dateToString(value3)).to.equal('2017-10-10'); | |
343 | 344 | |
344 | 345 | expect(value4[0] instanceof Date).to.equal(true); |
345 | 346 | expect(value4[1] instanceof Date).to.equal(true); | ... | ... |