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

weisiren168 · Jun 20, 2019 · 18eaa95 · 18eaa95
1 parent eaa63a8
commit 18eaa95
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 9 deletions.
diff --git a/packages/dropdown/src/dropdown-menu.vue b/packages/dropdown/src/dropdown-menu.vue
@@ -44,8 +44,11 @@
     },
 
     mounted() {
-      this.$parent.popperElm = this.popperElm = this.$el;
-      this.referenceElm = this.$parent.$el;
+      this.dropdown.popperElm = this.popperElm = this.$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: {

diff --git a/packages/dropdown/src/dropdown.vue b/packages/dropdown/src/dropdown.vue
@@ -79,8 +79,6 @@
 
     mounted() {
       this.$on('menu-item-click', this.handleMenuItemClick);
-      this.initEvent();
-      this.initAria();
     },
 
     watch: {
@@ -145,7 +143,6 @@
         } else if ([9, 27].indexOf(keyCode) > -1) { // tab || esc
           this.hide();
         }
-        return;
       },
       handleItemKeyDown(ev) {
         const keyCode = ev.keyCode;
@@ -174,7 +171,6 @@
           this.hide();
           this.triggerElm.focus();
         }
-        return;
       },
       resetTabindex(ele) { // 下次tab时组件聚焦元素
         this.removeTabindex();
@@ -190,8 +186,6 @@
         this.dropdownElm.setAttribute('id', this.listId);
         this.triggerElm.setAttribute('aria-haspopup', 'list');
         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) { // 自定义
           this.triggerElm.setAttribute('role', 'button');
@@ -205,7 +199,7 @@
           ? this.$refs.trigger.$el
           : 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
         dropdownElm.addEventListener('keydown', handleItemKeyDown, true); // item keydown
@@ -238,6 +232,14 @@
       },
       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();
       }
     },