Commit 105af4ee574d50a8b32ec82ec9fc8aa9c47d10c2

Authored by Aresn
Committed by GitHub
2 parents 8ab10470 5a2efc4a

Merge pull request #2872 from lison16/menu

update Menu
examples/routers/menu.vue
1 <template> 1 <template>
2 <div> 2 <div>
3 - <Menu :theme="theme1" active-name="1" accordion @on-select="handleSelect" @on-open-change="handleOpen" :open-names="openArr"> 3 + <Menu :theme="theme1" active-name="1" accordion @on-select="handleSelect" @on-open-change="handleOpen" :open-names="openArr">
4 <Menu-item name="1"> 4 <Menu-item name="1">
5 <Icon type="ios-paper"></Icon> 5 <Icon type="ios-paper"></Icon>
6 一级1 6 一级1
src/components/menu/menu-group.vue
@@ -5,11 +5,12 @@ @@ -5,11 +5,12 @@
5 </li> 5 </li>
6 </template> 6 </template>
7 <script> 7 <script>
8 - import { findComponentUpward, findComponentsUpward } from '../../utils/assist'; 8 + import mixin from './mixin';
9 const prefixCls = 'ivu-menu'; 9 const prefixCls = 'ivu-menu';
10 10
11 export default { 11 export default {
12 name: 'MenuGroup', 12 name: 'MenuGroup',
  13 + mixins: [ mixin ],
13 props: { 14 props: {
14 title: { 15 title: {
15 type: String, 16 type: String,
@@ -22,14 +23,8 @@ @@ -22,14 +23,8 @@
22 }; 23 };
23 }, 24 },
24 computed: { 25 computed: {
25 - parentSubmenuNum () {  
26 - return findComponentsUpward(this, 'Submenu').length;  
27 - },  
28 - hasParentSubmenu () {  
29 - return findComponentUpward(this, 'Submenu');  
30 - },  
31 groupStyle () { 26 groupStyle () {
32 - return this.hasParentSubmenu ? { 27 + return this.hasParentSubmenu && this.mode !== 'horizontal' ? {
33 paddingLeft: 43 + (this.parentSubmenuNum - 1) * 28 + 'px' 28 paddingLeft: 43 + (this.parentSubmenuNum - 1) * 28 + 'px'
34 } : {}; 29 } : {};
35 } 30 }
src/components/menu/menu-item.vue
@@ -37,7 +37,7 @@ @@ -37,7 +37,7 @@
37 ]; 37 ];
38 }, 38 },
39 itemStyle () { 39 itemStyle () {
40 - return this.hasParentSubmenu ? { 40 + return this.hasParentSubmenu && this.mode !== 'horizontal' ? {
41 paddingLeft: 43 + (this.parentSubmenuNum - 1) * 24 + 'px' 41 paddingLeft: 43 + (this.parentSubmenuNum - 1) * 24 + 'px'
42 } : {}; 42 } : {};
43 } 43 }
src/components/menu/mixin.js
1 import { findComponentUpward, findComponentsUpward } from '../../utils/assist'; 1 import { findComponentUpward, findComponentsUpward } from '../../utils/assist';
2 export default { 2 export default {
  3 + data () {
  4 + return {
  5 + menu: findComponentUpward(this, 'Menu')
  6 + };
  7 + },
3 computed: { 8 computed: {
4 hasParentSubmenu () { 9 hasParentSubmenu () {
5 return findComponentUpward(this, 'Submenu'); 10 return findComponentUpward(this, 'Submenu');
6 }, 11 },
7 parentSubmenuNum () { 12 parentSubmenuNum () {
8 return findComponentsUpward(this, 'Submenu').length; 13 return findComponentsUpward(this, 'Submenu').length;
  14 + },
  15 + mode () {
  16 + return this.menu.mode;
9 } 17 }
10 } 18 }
11 }; 19 };
12 \ No newline at end of file 20 \ No newline at end of file
src/components/menu/submenu.vue
@@ -46,8 +46,7 @@ @@ -46,8 +46,7 @@
46 prefixCls: prefixCls, 46 prefixCls: prefixCls,
47 active: false, 47 active: false,
48 opened: false, 48 opened: false,
49 - dropWidth: parseFloat(getStyle(this.$el, 'width')),  
50 - parent: findComponentUpward(this, 'Menu') 49 + dropWidth: parseFloat(getStyle(this.$el, 'width'))
51 }; 50 };
52 }, 51 },
53 computed: { 52 computed: {
@@ -63,11 +62,8 @@ @@ -63,11 +62,8 @@
63 } 62 }
64 ]; 63 ];
65 }, 64 },
66 - mode () {  
67 - return this.parent.mode;  
68 - },  
69 accordion () { 65 accordion () {
70 - return this.parent.accordion; 66 + return this.menu.accordion;
71 }, 67 },
72 dropStyle () { 68 dropStyle () {
73 let style = {}; 69 let style = {};
@@ -76,7 +72,7 @@ @@ -76,7 +72,7 @@
76 return style; 72 return style;
77 }, 73 },
78 titleStyle () { 74 titleStyle () {
79 - return this.hasParentSubmenu ? { 75 + return this.hasParentSubmenu && this.mode !== 'horizontal' ? {
80 paddingLeft: 43 + (this.parentSubmenuNum - 1) * 24 + 'px' 76 paddingLeft: 43 + (this.parentSubmenuNum - 1) * 24 + 'px'
81 } : {}; 77 } : {};
82 } 78 }
@@ -88,7 +84,7 @@ @@ -88,7 +84,7 @@
88 84
89 clearTimeout(this.timeout); 85 clearTimeout(this.timeout);
90 this.timeout = setTimeout(() => { 86 this.timeout = setTimeout(() => {
91 - this.parent.updateOpenKeys(this.name); 87 + this.menu.updateOpenKeys(this.name);
92 this.opened = true; 88 this.opened = true;
93 }, 250); 89 }, 250);
94 }, 90 },
@@ -98,7 +94,7 @@ @@ -98,7 +94,7 @@
98 94
99 clearTimeout(this.timeout); 95 clearTimeout(this.timeout);
100 this.timeout = setTimeout(() => { 96 this.timeout = setTimeout(() => {
101 - this.parent.updateOpenKeys(this.name); 97 + this.menu.updateOpenKeys(this.name);
102 this.opened = false; 98 this.opened = false;
103 }, 150); 99 }, 150);
104 }, 100 },
@@ -112,7 +108,7 @@ @@ -112,7 +108,7 @@
112 }); 108 });
113 } 109 }
114 this.opened = !opened; 110 this.opened = !opened;
115 - this.parent.updateOpenKeys(this.name); 111 + this.menu.updateOpenKeys(this.name);
116 } 112 }
117 }, 113 },
118 watch: { 114 watch: {