github
/
element
mirror of https://github.com/ElemeFE/element
1
0
Fork 0
Code Issues Releases Wiki Activity

Dropdown: compatible with 2.6 new v-slot syntax (#14832)

pull/14863/head
hetech 2019-03-27 16:14:00 +08:00 committed by iamkun
parent 9def85be4a
commit ea55f525a1
2 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/dropdown/src/dropdown-menu.vue
View File

@ -44,8 +44,11 @@
}, },
mounted() { mounted() {
this.$parent.popperElm = this.popperElm = this.$el; this.dropdown.popperElm = this.popperElm = this.$el;
this.referenceElm = this.$parent.$el; this.referenceElm = this.dropdown.$el;
// compatible with 2.6 new v-slot syntax
// issue link https://github.com/ElemeFE/element/issues/14345
this.dropdown.initDomOperation();
}, },
watch: { watch: {

16
packages/dropdown/src/dropdown.vue
View File

@ -79,8 +79,6 @@
mounted() { mounted() {
this.$on('menu-item-click', this.handleMenuItemClick); this.$on('menu-item-click', this.handleMenuItemClick);
this.initEvent();
this.initAria();
}, },
watch: { watch: {
@ -145,7 +143,6 @@
} else if ([9, 27].indexOf(keyCode) > -1) { // tab || esc } else if ([9, 27].indexOf(keyCode) > -1) { // tab || esc
this.hide(); this.hide();
} }
return;
}, },
handleItemKeyDown(ev) { handleItemKeyDown(ev) {
const keyCode = ev.keyCode; const keyCode = ev.keyCode;
@ -174,7 +171,6 @@
this.hide(); this.hide();
this.triggerElm.focus(); this.triggerElm.focus();
} }
return;
}, },
resetTabindex(ele) { // 下次tab时组件聚焦元素 resetTabindex(ele) { // 下次tab时组件聚焦元素
this.removeTabindex(); this.removeTabindex();
@ -190,8 +186,6 @@
this.dropdownElm.setAttribute('id', this.listId); this.dropdownElm.setAttribute('id', this.listId);
this.triggerElm.setAttribute('aria-haspopup', 'list'); this.triggerElm.setAttribute('aria-haspopup', 'list');
this.triggerElm.setAttribute('aria-controls', this.listId); this.triggerElm.setAttribute('aria-controls', this.listId);
this.menuItems = this.dropdownElm.querySelectorAll("[tabindex='-1']");
this.menuItemsArray = Array.prototype.slice.call(this.menuItems);
if (!this.splitButton) { // 自定义 if (!this.splitButton) { // 自定义
this.triggerElm.setAttribute('role', 'button'); this.triggerElm.setAttribute('role', 'button');
@ -205,7 +199,7 @@
? this.$refs.trigger.$el ? this.$refs.trigger.$el
: this.$slots.default[0].elm; : this.$slots.default[0].elm;
let dropdownElm = this.dropdownElm = this.$slots.dropdown[0].elm; let dropdownElm = this.dropdownElm;
this.triggerElm.addEventListener('keydown', handleTriggerKeyDown); // triggerElm keydown this.triggerElm.addEventListener('keydown', handleTriggerKeyDown); // triggerElm keydown
dropdownElm.addEventListener('keydown', handleItemKeyDown, true); // item keydown dropdownElm.addEventListener('keydown', handleItemKeyDown, true); // item keydown
@ -238,6 +232,14 @@
}, },
focus() { focus() {
this.triggerElm.focus && this.triggerElm.focus(); this.triggerElm.focus && this.triggerElm.focus();
},
initDomOperation() {
this.dropdownElm = this.popperElm;
this.menuItems = this.dropdownElm.querySelectorAll("[tabindex='-1']");
this.menuItemsArray = [].slice.call(this.menuItems);
this.initEvent();
this.initAria();
} }
}, },