Commit 171bc082f71f518c2cab1e4a3a04fba2a03a2fe5
Committed by
GitHub
Merge pull request #4598 from vincentfintend/fix-select-4273
fix select #4273
Showing
1 changed file
with
7 additions
and
25 deletions
Show diff stats
src/components/select/select.vue
@@ -44,8 +44,6 @@ | @@ -44,8 +44,6 @@ | ||
44 | @on-input-focus="isFocused = true" | 44 | @on-input-focus="isFocused = true" |
45 | @on-input-blur="isFocused = false" | 45 | @on-input-blur="isFocused = false" |
46 | @on-clear="clearSingleSelect" | 46 | @on-clear="clearSingleSelect" |
47 | - | ||
48 | - @on-keydown="handleFilterInputKeyDown" | ||
49 | /> | 47 | /> |
50 | </slot> | 48 | </slot> |
51 | </div> | 49 | </div> |
@@ -266,7 +264,7 @@ | @@ -266,7 +264,7 @@ | ||
266 | unchangedQuery: true, | 264 | unchangedQuery: true, |
267 | hasExpectedValue: false, | 265 | hasExpectedValue: false, |
268 | preventRemoteCall: false, | 266 | preventRemoteCall: false, |
269 | - filterQueryKeyDown: false, // #4273 | 267 | + filterQueryChange: false, // #4273 |
270 | }; | 268 | }; |
271 | }, | 269 | }, |
272 | computed: { | 270 | computed: { |
@@ -296,12 +294,6 @@ | @@ -296,12 +294,6 @@ | ||
296 | [`${prefixCls}-selection-focused`]: this.isFocused | 294 | [`${prefixCls}-selection-focused`]: this.isFocused |
297 | }; | 295 | }; |
298 | }, | 296 | }, |
299 | - queryStringMatchesSelectedOption(){ | ||
300 | - const selectedOptions = this.values[0]; | ||
301 | - if (!selectedOptions) return false; | ||
302 | - const [query, label] = [this.query, selectedOptions.label].map(str => (str || '').trim()); | ||
303 | - return !this.multiple && this.unchangedQuery && query === label; | ||
304 | - }, | ||
305 | localeNotFoundText () { | 297 | localeNotFoundText () { |
306 | if (typeof this.notFoundText === 'undefined') { | 298 | if (typeof this.notFoundText === 'undefined') { |
307 | return this.t('i.select.noMatch'); | 299 | return this.t('i.select.noMatch'); |
@@ -368,10 +360,6 @@ | @@ -368,10 +360,6 @@ | ||
368 | }); | 360 | }); |
369 | }); | 361 | }); |
370 | } | 362 | } |
371 | - /** | ||
372 | - * Not sure why use hasDefaultSelected #4273 | ||
373 | - * */ | ||
374 | - let hasDefaultSelected = slotOptions.some(option => this.query === option.key); | ||
375 | for (let option of slotOptions) { | 363 | for (let option of slotOptions) { |
376 | 364 | ||
377 | const cOptions = option.componentOptions; | 365 | const cOptions = option.componentOptions; |
@@ -395,7 +383,7 @@ | @@ -395,7 +383,7 @@ | ||
395 | if (cOptions.children.length > 0) selectOptions.push({...option}); | 383 | if (cOptions.children.length > 0) selectOptions.push({...option}); |
396 | } else { | 384 | } else { |
397 | // ignore option if not passing filter | 385 | // ignore option if not passing filter |
398 | - if (!hasDefaultSelected || this.filterQueryKeyDown) { | 386 | + if (this.filterQueryChange) { |
399 | const optionPassesFilter = this.filterable ? this.validateOption(cOptions) : option; | 387 | const optionPassesFilter = this.filterable ? this.validateOption(cOptions) : option; |
400 | if (!optionPassesFilter) continue; | 388 | if (!optionPassesFilter) continue; |
401 | } | 389 | } |
@@ -405,8 +393,6 @@ | @@ -405,8 +393,6 @@ | ||
405 | } | 393 | } |
406 | } | 394 | } |
407 | 395 | ||
408 | - this.filterQueryKeyDown = false; | ||
409 | - | ||
410 | return selectOptions; | 396 | return selectOptions; |
411 | }, | 397 | }, |
412 | flatOptions(){ | 398 | flatOptions(){ |
@@ -479,8 +465,6 @@ | @@ -479,8 +465,6 @@ | ||
479 | }, | 465 | }, |
480 | 466 | ||
481 | validateOption({children, elm, propsData}){ | 467 | validateOption({children, elm, propsData}){ |
482 | - if (this.queryStringMatchesSelectedOption) return true; | ||
483 | - | ||
484 | const value = propsData.value; | 468 | const value = propsData.value; |
485 | const label = propsData.label || ''; | 469 | const label = propsData.label || ''; |
486 | const textContent = (elm && elm.textContent) || (children || []).reduce((str, node) => { | 470 | const textContent = (elm && elm.textContent) || (children || []).reduce((str, node) => { |
@@ -545,6 +529,7 @@ | @@ -545,6 +529,7 @@ | ||
545 | this.focusIndex = -1; | 529 | this.focusIndex = -1; |
546 | this.unchangedQuery = true; | 530 | this.unchangedQuery = true; |
547 | this.values = []; | 531 | this.values = []; |
532 | + this.filterQueryChange = false; | ||
548 | }, | 533 | }, |
549 | handleKeydown (e) { | 534 | handleKeydown (e) { |
550 | if (e.key === 'Backspace'){ | 535 | if (e.key === 'Backspace'){ |
@@ -644,11 +629,15 @@ | @@ -644,11 +629,15 @@ | ||
644 | if (!this.autoComplete) this.$nextTick(() => inputField.focus()); | 629 | if (!this.autoComplete) this.$nextTick(() => inputField.focus()); |
645 | } | 630 | } |
646 | this.broadcast('Drop', 'on-update-popper'); | 631 | this.broadcast('Drop', 'on-update-popper'); |
632 | + setTimeout(() => { | ||
633 | + this.filterQueryChange = false; | ||
634 | + },300) | ||
647 | }, | 635 | }, |
648 | onQueryChange(query) { | 636 | onQueryChange(query) { |
649 | if (query.length > 0 && query !== this.query) this.visible = true; | 637 | if (query.length > 0 && query !== this.query) this.visible = true; |
650 | this.query = query; | 638 | this.query = query; |
651 | this.unchangedQuery = this.visible; | 639 | this.unchangedQuery = this.visible; |
640 | + this.filterQueryChange = true; | ||
652 | }, | 641 | }, |
653 | toggleHeaderFocus({type}){ | 642 | toggleHeaderFocus({type}){ |
654 | if (this.disabled) { | 643 | if (this.disabled) { |
@@ -664,13 +653,6 @@ | @@ -664,13 +653,6 @@ | ||
664 | this.hasExpectedValue = true; | 653 | this.hasExpectedValue = true; |
665 | } | 654 | } |
666 | }, | 655 | }, |
667 | - /** | ||
668 | - * 下面的方法,当 filterable 时,输入内容时,标记,用于区分和直接选择而引起的 bug | ||
669 | - * #4273 | ||
670 | - * */ | ||
671 | - handleFilterInputKeyDown () { | ||
672 | - this.filterQueryKeyDown = true; | ||
673 | - }, | ||
674 | }, | 656 | }, |
675 | watch: { | 657 | watch: { |
676 | value(value){ | 658 | value(value){ |