mirror of https://github.com/ElemeFE/element
Select: fix clearable still working bug in disabled mode
parent
88a5772e91
commit
af0d7288bd
|
@ -121,7 +121,7 @@
|
||||||
|
|
||||||
created() {
|
created() {
|
||||||
this.parent.options.push(this);
|
this.parent.options.push(this);
|
||||||
if (this.parent.remote) this.parent.cachedOptions.push(this);
|
this.parent.cachedOptions.push(this);
|
||||||
this.parent.optionsCount++;
|
this.parent.optionsCount++;
|
||||||
this.parent.filteredOptionsCount++;
|
this.parent.filteredOptionsCount++;
|
||||||
this.index = this.parent.options.indexOf(this);
|
this.index = this.parent.options.indexOf(this);
|
||||||
|
|
|
@ -102,27 +102,17 @@
|
||||||
|
|
||||||
computed: {
|
computed: {
|
||||||
iconClass() {
|
iconClass() {
|
||||||
return this.showCloseIcon ? 'circle-close' : (this.remote && this.filterable ? '' : 'caret-top');
|
|
||||||
},
|
|
||||||
|
|
||||||
debounce() {
|
|
||||||
return this.remote ? 300 : 0;
|
|
||||||
},
|
|
||||||
|
|
||||||
showCloseIcon() {
|
|
||||||
let criteria = this.clearable &&
|
let criteria = this.clearable &&
|
||||||
|
!this.disabled &&
|
||||||
this.inputHovering &&
|
this.inputHovering &&
|
||||||
!this.multiple &&
|
!this.multiple &&
|
||||||
this.value !== undefined &&
|
this.value !== undefined &&
|
||||||
this.value !== '';
|
this.value !== '';
|
||||||
if (!this.$el) return false;
|
return criteria ? 'circle-close is-show-close' : (this.remote && this.filterable ? '' : 'caret-top');
|
||||||
this.$nextTick(() => {
|
},
|
||||||
let icon = this.$el.querySelector('.el-input__icon');
|
|
||||||
if (icon) {
|
debounce() {
|
||||||
criteria ? addClass(icon, 'is-show-close') : removeClass(icon, 'is-show-close');
|
return this.remote ? 300 : 0;
|
||||||
}
|
|
||||||
});
|
|
||||||
return criteria;
|
|
||||||
},
|
},
|
||||||
|
|
||||||
emptyText() {
|
emptyText() {
|
||||||
|
@ -217,13 +207,13 @@
|
||||||
} else {
|
} else {
|
||||||
this.currentPlaceholder = this.cachedPlaceHolder;
|
this.currentPlaceholder = this.cachedPlaceHolder;
|
||||||
}
|
}
|
||||||
|
this.dispatch('ElFormItem', 'el.form.change', val);
|
||||||
}
|
}
|
||||||
this.selected = this.getSelected();
|
this.setSelected();
|
||||||
if (this.filterable && !this.multiple) {
|
if (this.filterable && !this.multiple) {
|
||||||
this.inputLength = 20;
|
this.inputLength = 20;
|
||||||
}
|
}
|
||||||
this.$emit('change', val);
|
this.$emit('change', val);
|
||||||
this.dispatch('ElFormItem', 'el.form.change', val);
|
|
||||||
},
|
},
|
||||||
|
|
||||||
query(val) {
|
query(val) {
|
||||||
|
@ -296,7 +286,7 @@
|
||||||
}
|
}
|
||||||
let inputs = this.$el.querySelectorAll('input');
|
let inputs = this.$el.querySelectorAll('input');
|
||||||
if ([].indexOf.call(inputs, document.activeElement) === -1) {
|
if ([].indexOf.call(inputs, document.activeElement) === -1) {
|
||||||
this.selected = this.getSelected();
|
this.setSelected();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -338,8 +328,7 @@
|
||||||
},
|
},
|
||||||
|
|
||||||
getOption(value) {
|
getOption(value) {
|
||||||
const option = (this.remote ? this.cachedOptions : this.options)
|
const option = this.cachedOptions.filter(option => option.value === value)[0];
|
||||||
.filter(option => option.value === value)[0];
|
|
||||||
if (option) return option;
|
if (option) return option;
|
||||||
const label = typeof value === 'string' || typeof value === 'number'
|
const label = typeof value === 'string' || typeof value === 'number'
|
||||||
? value : '';
|
? value : '';
|
||||||
|
@ -353,11 +342,12 @@
|
||||||
return newOption;
|
return newOption;
|
||||||
},
|
},
|
||||||
|
|
||||||
getSelected() {
|
setSelected() {
|
||||||
if (!this.multiple) {
|
if (!this.multiple) {
|
||||||
let option = this.getOption(this.value);
|
let option = this.getOption(this.value);
|
||||||
this.selectedLabel = option.currentLabel;
|
this.selectedLabel = option.currentLabel;
|
||||||
return option;
|
this.selected = option;
|
||||||
|
return;
|
||||||
}
|
}
|
||||||
let result = [];
|
let result = [];
|
||||||
if (Array.isArray(this.value)) {
|
if (Array.isArray(this.value)) {
|
||||||
|
@ -365,11 +355,11 @@
|
||||||
result.push(this.getOption(value));
|
result.push(this.getOption(value));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
return result;
|
this.selected = result;
|
||||||
},
|
},
|
||||||
|
|
||||||
handleIconClick(event) {
|
handleIconClick(event) {
|
||||||
if (this.iconClass === 'circle-close') {
|
if (this.iconClass.indexOf('circle-close') > -1) {
|
||||||
this.deleteSelected(event);
|
this.deleteSelected(event);
|
||||||
} else {
|
} else {
|
||||||
this.toggleMenu();
|
this.toggleMenu();
|
||||||
|
@ -535,7 +525,6 @@
|
||||||
deleteSelected(event) {
|
deleteSelected(event) {
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
this.$emit('input', '');
|
this.$emit('input', '');
|
||||||
this.$emit('change', '');
|
|
||||||
this.visible = false;
|
this.visible = false;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -576,6 +565,7 @@
|
||||||
if (!this.multiple && Array.isArray(this.value)) {
|
if (!this.multiple && Array.isArray(this.value)) {
|
||||||
this.$emit('input', '');
|
this.$emit('input', '');
|
||||||
}
|
}
|
||||||
|
this.setSelected();
|
||||||
|
|
||||||
this.debouncedOnInputChange = debounce(this.debounce, () => {
|
this.debouncedOnInputChange = debounce(this.debounce, () => {
|
||||||
this.onInputChange();
|
this.onInputChange();
|
||||||
|
@ -590,7 +580,6 @@
|
||||||
this.currentPlaceholder = '';
|
this.currentPlaceholder = '';
|
||||||
}
|
}
|
||||||
addResizeListener(this.$el, this.resetInputWidth);
|
addResizeListener(this.$el, this.resetInputWidth);
|
||||||
this.selected = this.getSelected();
|
|
||||||
if (this.remote && this.multiple) {
|
if (this.remote && this.multiple) {
|
||||||
this.resetInputHeight();
|
this.resetInputHeight();
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue