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 | } |