Merge pull request #2872 from lison16/menu

update Menu

src/components/menu/menu-group.vue

@@ -5,11 +5,12 @@
     </li>
 </template>
 <script>
-    import { findComponentUpward, findComponentsUpward } from '../../utils/assist';
+    import mixin from './mixin';
     const prefixCls = 'ivu-menu';
 
     export default {
         name: 'MenuGroup',
+        mixins: [ mixin ],
         props: {
             title: {
                 type: String,
@@ -22,14 +23,8 @@
             };
         },
         computed: {
-            parentSubmenuNum () {
-                return findComponentsUpward(this, 'Submenu').length;
-            },
-            hasParentSubmenu () {
-                return findComponentUpward(this, 'Submenu');
-            },
             groupStyle () {
-                return this.hasParentSubmenu ? {
+                return this.hasParentSubmenu && this.mode !== 'horizontal' ? {
                     paddingLeft: 43 + (this.parentSubmenuNum - 1) * 28 + 'px'
                 } : {};
             }

src/components/menu/menu-item.vue

@@ -37,7 +37,7 @@
                 ];
             },
             itemStyle () {
-                return this.hasParentSubmenu ? {
+                return this.hasParentSubmenu && this.mode !== 'horizontal' ? {
                     paddingLeft: 43 + (this.parentSubmenuNum - 1) * 24 + 'px'
                 } : {};
             }

src/components/menu/mixin.js

@@ -1,11 +1,19 @@
 import { findComponentUpward, findComponentsUpward } from '../../utils/assist';
 export default {
+    data () {
+        return {
+            menu: findComponentUpward(this, 'Menu')
+        };
+    },
     computed: {
         hasParentSubmenu () {
             return findComponentUpward(this, 'Submenu');
         },
         parentSubmenuNum () {
             return findComponentsUpward(this, 'Submenu').length;
+        },
+        mode () {
+            return this.menu.mode;
         }
     }
 };

src/components/menu/submenu.vue

@@ -46,8 +46,7 @@
                 prefixCls: prefixCls,
                 active: false,
                 opened: false,
-                dropWidth: parseFloat(getStyle(this.$el, 'width')),
+                dropWidth: parseFloat(getStyle(this.$el, 'width'))
-                parent: findComponentUpward(this, 'Menu')
             };
         },
         computed: {
@@ -63,11 +62,8 @@
                     }
                 ];
             },
-            mode () {
-                return this.parent.mode;
-            },
             accordion () {
-                return this.parent.accordion;
+                return this.menu.accordion;
             },
             dropStyle () {
                 let style = {};
@@ -76,7 +72,7 @@
                 return style;
             },
             titleStyle () {
-                return this.hasParentSubmenu ? {
+                return this.hasParentSubmenu && this.mode !== 'horizontal' ? {
                     paddingLeft: 43 + (this.parentSubmenuNum - 1) * 24 + 'px'
                 } : {};
             }
@@ -88,7 +84,7 @@
 
                 clearTimeout(this.timeout);
                 this.timeout = setTimeout(() => {
-                    this.parent.updateOpenKeys(this.name);
+                    this.menu.updateOpenKeys(this.name);
                     this.opened = true;
                 }, 250);
             },
@@ -98,7 +94,7 @@
 
                 clearTimeout(this.timeout);
                 this.timeout = setTimeout(() => {
-                    this.parent.updateOpenKeys(this.name);
+                    this.menu.updateOpenKeys(this.name);
                     this.opened = false;
                 }, 150);
             },
@@ -112,7 +108,7 @@
                     });
                 }
                 this.opened = !opened;
-                this.parent.updateOpenKeys(this.name);
+                this.menu.updateOpenKeys(this.name);
             }
         },
         watch: {