Commit 171bc082f71f518c2cab1e4a3a04fba2a03a2fe5

Authored by Aresn
Committed by GitHub
2 parents 47f03c54 ee5a8bcc

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