fix select

This commit is contained in:
vincentfintend 2018-09-28 18:23:28 +08:00
parent 47f03c5419
commit e732753290

View file

@ -44,8 +44,6 @@
@on-input-focus="isFocused = true" @on-input-focus="isFocused = true"
@on-input-blur="isFocused = false" @on-input-blur="isFocused = false"
@on-clear="clearSingleSelect" @on-clear="clearSingleSelect"
@on-keydown="handleFilterInputKeyDown"
/> />
</slot> </slot>
</div> </div>
@ -266,7 +264,7 @@
unchangedQuery: true, unchangedQuery: true,
hasExpectedValue: false, hasExpectedValue: false,
preventRemoteCall: false, preventRemoteCall: false,
filterQueryKeyDown: false, // #4273 filterQueryChange: false, // #4273
}; };
}, },
computed: { computed: {
@ -296,12 +294,6 @@
[`${prefixCls}-selection-focused`]: this.isFocused [`${prefixCls}-selection-focused`]: this.isFocused
}; };
}, },
queryStringMatchesSelectedOption(){
const selectedOptions = this.values[0];
if (!selectedOptions) return false;
const [query, label] = [this.query, selectedOptions.label].map(str => (str || '').trim());
return !this.multiple && this.unchangedQuery && query === label;
},
localeNotFoundText () { localeNotFoundText () {
if (typeof this.notFoundText === 'undefined') { if (typeof this.notFoundText === 'undefined') {
return this.t('i.select.noMatch'); return this.t('i.select.noMatch');
@ -368,10 +360,6 @@
}); });
}); });
} }
/**
* Not sure why use hasDefaultSelected #4273
* */
let hasDefaultSelected = slotOptions.some(option => this.query === option.key);
for (let option of slotOptions) { for (let option of slotOptions) {
const cOptions = option.componentOptions; const cOptions = option.componentOptions;
@ -395,7 +383,7 @@
if (cOptions.children.length > 0) selectOptions.push({...option}); if (cOptions.children.length > 0) selectOptions.push({...option});
} else { } else {
// ignore option if not passing filter // ignore option if not passing filter
if (!hasDefaultSelected || this.filterQueryKeyDown) { if (this.filterQueryChange) {
const optionPassesFilter = this.filterable ? this.validateOption(cOptions) : option; const optionPassesFilter = this.filterable ? this.validateOption(cOptions) : option;
if (!optionPassesFilter) continue; if (!optionPassesFilter) continue;
} }
@ -405,8 +393,6 @@
} }
} }
this.filterQueryKeyDown = false;
return selectOptions; return selectOptions;
}, },
flatOptions(){ flatOptions(){
@ -479,8 +465,6 @@
}, },
validateOption({children, elm, propsData}){ validateOption({children, elm, propsData}){
if (this.queryStringMatchesSelectedOption) return true;
const value = propsData.value; const value = propsData.value;
const label = propsData.label || ''; const label = propsData.label || '';
const textContent = (elm && elm.textContent) || (children || []).reduce((str, node) => { const textContent = (elm && elm.textContent) || (children || []).reduce((str, node) => {
@ -545,6 +529,7 @@
this.focusIndex = -1; this.focusIndex = -1;
this.unchangedQuery = true; this.unchangedQuery = true;
this.values = []; this.values = [];
this.filterQueryChange = false;
}, },
handleKeydown (e) { handleKeydown (e) {
if (e.key === 'Backspace'){ if (e.key === 'Backspace'){
@ -644,11 +629,15 @@
if (!this.autoComplete) this.$nextTick(() => inputField.focus()); if (!this.autoComplete) this.$nextTick(() => inputField.focus());
} }
this.broadcast('Drop', 'on-update-popper'); this.broadcast('Drop', 'on-update-popper');
setTimeout(()=>{
this.filterQueryChange = false;
},500)
}, },
onQueryChange(query) { onQueryChange(query) {
if (query.length > 0 && query !== this.query) this.visible = true; if (query.length > 0 && query !== this.query) this.visible = true;
this.query = query; this.query = query;
this.unchangedQuery = this.visible; this.unchangedQuery = this.visible;
this.filterQueryChange = true;
}, },
toggleHeaderFocus({type}){ toggleHeaderFocus({type}){
if (this.disabled) { if (this.disabled) {
@ -664,13 +653,6 @@
this.hasExpectedValue = true; this.hasExpectedValue = true;
} }
}, },
/**
* 下面的方法 filterable 输入内容时标记用于区分和直接选择而引起的 bug
* #4273
* */
handleFilterInputKeyDown () {
this.filterQueryKeyDown = true;
},
}, },
watch: { watch: {
value(value){ value(value){