fix(MdMenu): Close menu while another is opened (#1266)

Remove `stopPropagation` from `MdMenu` to trigger close-menu click observer fix #1255
vuematerial · Dec 6, 2017 · ef720c4 · ef720c4
1 parent 9073313
commit ef720c4
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/src/components/MdMenu/MdMenu.vue b/src/components/MdMenu/MdMenu.vue
@@ -57,7 +57,8 @@
           dense: this.mdDense,
           closeOnSelect: this.mdCloseOnSelect,
           bodyClickObserver: null,
-          windowResizeObserver: null
+          windowResizeObserver: null,
+          $el: this.$el
         }
       }
     },
@@ -105,11 +106,11 @@
     },
     methods: {
       toggleContent ($event) {
-        $event.stopPropagation()
         this.MdMenu.active = !this.MdMenu.active
       }
     },
     async mounted () {
+      this.MdMenu.$el = this.$el
       await this.$nextTick()
 
       this.triggerEl = this.$el.querySelector('[md-menu-trigger]')

diff --git a/src/components/MdMenu/MdMenuContent.vue b/src/components/MdMenu/MdMenuContent.vue
@@ -187,8 +187,8 @@
         if (document) {
           this.MdMenu.bodyClickObserver = new MdObserveEvent(document.body, 'click', $event => {
             $event.stopPropagation()
-
-            if (!this.$el.contains($event.target)) {
+            let isMdMenu = this.MdMenu.$el ? this.MdMenu.$el.contains($event.target) : false
+            if (!this.$el.contains($event.target) && !isMdMenu) {
               this.MdMenu.active = false
               this.MdMenu.bodyClickObserver.destroy()
               this.MdMenu.windowResizeObserver.destroy()