Normalise behaviour when opening select with selected option present in options
This commit is contained in:
parent
7dbde804d8
commit
31788df30b
1 changed files with 12 additions and 0 deletions
|
@ -122,6 +122,8 @@
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const ANIMATION_TIMEOUT = 300;
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'iSelect',
|
name: 'iSelect',
|
||||||
mixins: [ Emitter, Locale ],
|
mixins: [ Emitter, Locale ],
|
||||||
|
@ -230,6 +232,7 @@
|
||||||
slotOptions: this.$slots.default,
|
slotOptions: this.$slots.default,
|
||||||
caretPosition: -1,
|
caretPosition: -1,
|
||||||
lastRemoteQuery: '',
|
lastRemoteQuery: '',
|
||||||
|
unchangedQuery: true,
|
||||||
hasExpectedValue: false,
|
hasExpectedValue: false,
|
||||||
preventRemoteCall: false,
|
preventRemoteCall: false,
|
||||||
};
|
};
|
||||||
|
@ -261,6 +264,10 @@
|
||||||
[`${prefixCls}-selection-focused`]: this.isFocused
|
[`${prefixCls}-selection-focused`]: this.isFocused
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
queryStringMatchesSelectedOption(){
|
||||||
|
const selectedOptions = this.values[0];
|
||||||
|
return selectedOptions && !this.multiple && this.unchangedQuery && this.query === selectedOptions.value;
|
||||||
|
},
|
||||||
localeNotFoundText () {
|
localeNotFoundText () {
|
||||||
if (typeof this.notFoundText === 'undefined') {
|
if (typeof this.notFoundText === 'undefined') {
|
||||||
return this.t('i.select.noMatch');
|
return this.t('i.select.noMatch');
|
||||||
|
@ -425,6 +432,7 @@
|
||||||
},
|
},
|
||||||
|
|
||||||
validateOption({elm, propsData}){
|
validateOption({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 || '';
|
const textContent = elm && elm.textContent || '';
|
||||||
|
@ -446,6 +454,7 @@
|
||||||
},
|
},
|
||||||
hideMenu () {
|
hideMenu () {
|
||||||
this.toggleMenu(null, false);
|
this.toggleMenu(null, false);
|
||||||
|
setTimeout(() => this.unchangedQuery = true, ANIMATION_TIMEOUT);
|
||||||
},
|
},
|
||||||
onClickOutside(event){
|
onClickOutside(event){
|
||||||
if (this.visible) {
|
if (this.visible) {
|
||||||
|
@ -469,6 +478,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
reset(){
|
reset(){
|
||||||
|
this.unchangedQuery = true;
|
||||||
this.values = [];
|
this.values = [];
|
||||||
},
|
},
|
||||||
handleKeydown (e) {
|
handleKeydown (e) {
|
||||||
|
@ -553,6 +563,7 @@
|
||||||
|
|
||||||
this.isFocused = true; // so we put back focus after clicking with mouse on option elements
|
this.isFocused = true; // so we put back focus after clicking with mouse on option elements
|
||||||
} else {
|
} else {
|
||||||
|
this.query = option.value;
|
||||||
this.values = [option];
|
this.values = [option];
|
||||||
this.lastRemoteQuery = '';
|
this.lastRemoteQuery = '';
|
||||||
this.hideMenu();
|
this.hideMenu();
|
||||||
|
@ -565,6 +576,7 @@
|
||||||
this.broadcast('Drop', 'on-update-popper');
|
this.broadcast('Drop', 'on-update-popper');
|
||||||
},
|
},
|
||||||
onQueryChange(query) {
|
onQueryChange(query) {
|
||||||
|
this.unchangedQuery = false;
|
||||||
this.query = query;
|
this.query = query;
|
||||||
if (this.query.length > 0) this.visible = true;
|
if (this.query.length > 0) this.visible = true;
|
||||||
},
|
},
|
||||||
|
|
Loading…
Add table
Reference in a new issue