|
@@ -149,7 +149,10 @@
|
|
},
|
|
},
|
|
watch: {
|
|
watch: {
|
|
suggestionVisible(val) {
|
|
suggestionVisible(val) {
|
|
- this.broadcast('ElAutocompleteSuggestions', 'visible', [val, this.$refs.input.$refs.input.offsetWidth]);
|
|
|
|
|
|
+ let $input = this.getInput();
|
|
|
|
+ if ($input) {
|
|
|
|
+ this.broadcast('ElAutocompleteSuggestions', 'visible', [val, $input.offsetWidth]);
|
|
|
|
+ }
|
|
}
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
@@ -248,7 +251,11 @@
|
|
suggestion.scrollTop -= highlightItem.scrollHeight;
|
|
suggestion.scrollTop -= highlightItem.scrollHeight;
|
|
}
|
|
}
|
|
this.highlightedIndex = index;
|
|
this.highlightedIndex = index;
|
|
- this.$el.querySelector('.el-input__inner').setAttribute('aria-activedescendant', `${this.id}-item-${this.highlightedIndex}`);
|
|
|
|
|
|
+ let $input = this.getInput();
|
|
|
|
+ $input.setAttribute('aria-activedescendant', `${this.id}-item-${this.highlightedIndex}`);
|
|
|
|
+ },
|
|
|
|
+ getInput() {
|
|
|
|
+ return this.$refs.input.getInput();
|
|
}
|
|
}
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
@@ -256,7 +263,7 @@
|
|
this.$on('item-click', item => {
|
|
this.$on('item-click', item => {
|
|
this.select(item);
|
|
this.select(item);
|
|
});
|
|
});
|
|
- let $input = this.$el.querySelector('.el-input__inner');
|
|
|
|
|
|
+ let $input = this.getInput();
|
|
$input.setAttribute('role', 'textbox');
|
|
$input.setAttribute('role', 'textbox');
|
|
$input.setAttribute('aria-autocomplete', 'list');
|
|
$input.setAttribute('aria-autocomplete', 'list');
|
|
$input.setAttribute('aria-controls', 'id');
|
|
$input.setAttribute('aria-controls', 'id');
|