Commit 3a3be61a254f53c2589b93c34fdddb62d418054b
Committed by
GitHub

Merge pull request #3798 from m430/bug-3795
Select patches: fix bug #3795 #3722 修复select异步获取option数据导致,v-model失效等问题
Showing
2 changed files
with
19 additions
and
8 deletions
Show diff stats
src/components/select/select-head.vue
src/components/select/select.vue
@@ -230,9 +230,7 @@ | @@ -230,9 +230,7 @@ | ||
230 | }).filter(Boolean); | 230 | }).filter(Boolean); |
231 | } | 231 | } |
232 | 232 | ||
233 | - if (this.values.length > 0 && this.selectOptions.length === 0){ | ||
234 | - this.hasExpectedValue = this.values; | ||
235 | - } | 233 | + this.checkUpdateStatus(); |
236 | }, | 234 | }, |
237 | data () { | 235 | data () { |
238 | 236 | ||
@@ -353,7 +351,7 @@ | @@ -353,7 +351,7 @@ | ||
353 | }); | 351 | }); |
354 | }); | 352 | }); |
355 | } | 353 | } |
356 | - | 354 | + let hasDefaultSelected = slotOptions.some(option => this.query === option.key); |
357 | for (let option of slotOptions) { | 355 | for (let option of slotOptions) { |
358 | 356 | ||
359 | const cOptions = option.componentOptions; | 357 | const cOptions = option.componentOptions; |
@@ -377,8 +375,10 @@ | @@ -377,8 +375,10 @@ | ||
377 | if (cOptions.children.length > 0) selectOptions.push({...option}); | 375 | if (cOptions.children.length > 0) selectOptions.push({...option}); |
378 | } else { | 376 | } else { |
379 | // ignore option if not passing filter | 377 | // ignore option if not passing filter |
380 | - const optionPassesFilter = this.filterable ? this.validateOption(cOptions) : option; | ||
381 | - if (!optionPassesFilter) continue; | 378 | + if (!hasDefaultSelected) { |
379 | + const optionPassesFilter = this.filterable ? this.validateOption(cOptions) : option; | ||
380 | + if (!optionPassesFilter) continue; | ||
381 | + } | ||
382 | 382 | ||
383 | optionCounter = optionCounter + 1; | 383 | optionCounter = optionCounter + 1; |
384 | selectOptions.push(this.processOption(option, selectedValues, optionCounter === currentIndex)); | 384 | selectOptions.push(this.processOption(option, selectedValues, optionCounter === currentIndex)); |
@@ -426,6 +426,7 @@ | @@ -426,6 +426,7 @@ | ||
426 | const {multiple, value} = this; | 426 | const {multiple, value} = this; |
427 | let initialValue = Array.isArray(value) ? value : [value]; | 427 | let initialValue = Array.isArray(value) ? value : [value]; |
428 | if (!multiple && (typeof initialValue[0] === 'undefined' || (String(initialValue[0]).trim() === '' && !Number.isFinite(initialValue[0])))) initialValue = []; | 428 | if (!multiple && (typeof initialValue[0] === 'undefined' || (String(initialValue[0]).trim() === '' && !Number.isFinite(initialValue[0])))) initialValue = []; |
429 | + if (this.remote && !this.multiple && this.value) this.query = value; | ||
429 | return initialValue.filter((item) => { | 430 | return initialValue.filter((item) => { |
430 | return Boolean(item) || item === 0; | 431 | return Boolean(item) || item === 0; |
431 | }); | 432 | }); |
@@ -632,12 +633,19 @@ | @@ -632,12 +633,19 @@ | ||
632 | }, | 633 | }, |
633 | updateSlotOptions(){ | 634 | updateSlotOptions(){ |
634 | this.slotOptions = this.$slots.default; | 635 | this.slotOptions = this.$slots.default; |
636 | + }, | ||
637 | + checkUpdateStatus() { | ||
638 | + if (this.getInitialValue().length > 0 && this.selectOptions.length === 0) { | ||
639 | + this.hasExpectedValue = true; | ||
640 | + } | ||
635 | } | 641 | } |
636 | }, | 642 | }, |
637 | watch: { | 643 | watch: { |
638 | value(value){ | 644 | value(value){ |
639 | const {getInitialValue, getOptionData, publicValue} = this; | 645 | const {getInitialValue, getOptionData, publicValue} = this; |
640 | 646 | ||
647 | + this.checkUpdateStatus(); | ||
648 | + | ||
641 | if (value === '') this.values = []; | 649 | if (value === '') this.values = []; |
642 | else if (JSON.stringify(value) !== JSON.stringify(publicValue)) { | 650 | else if (JSON.stringify(value) !== JSON.stringify(publicValue)) { |
643 | this.$nextTick(() => this.values = getInitialValue().map(getOptionData).filter(Boolean)); | 651 | this.$nextTick(() => this.values = getInitialValue().map(getOptionData).filter(Boolean)); |
@@ -716,7 +724,10 @@ | @@ -716,7 +724,10 @@ | ||
716 | this.broadcast('Drop', open ? 'on-update-popper' : 'on-destroy-popper'); | 724 | this.broadcast('Drop', open ? 'on-update-popper' : 'on-destroy-popper'); |
717 | }, | 725 | }, |
718 | selectOptions(){ | 726 | selectOptions(){ |
719 | - if (this.hasExpectedValue){ | 727 | + if (this.hasExpectedValue && this.selectOptions.length > 0){ |
728 | + if (this.values.length === 0) { | ||
729 | + this.values = this.getInitialValue(); | ||
730 | + } | ||
720 | this.values = this.values.map(this.getOptionData).filter(Boolean); | 731 | this.values = this.values.map(this.getOptionData).filter(Boolean); |
721 | this.hasExpectedValue = false; | 732 | this.hasExpectedValue = false; |
722 | } | 733 | } |