other / mew-iview

Commit bae9f443e73974e58920d4ef60da5435e28bb956

Authored by Aresn
Committed by GitHub
2 parents 9aacb4c8 1f7905d4

Merge pull request #3803 from lison16/su 

fixed bug of menu when use recursive components and set accordion
Showing 2 changed files with 13 additions and 3 deletions   Show diff stats
Inline Side-by-side
examples/routers/menu.vue
  Show/Hide comments   View file @bae9f44
@@ -44,13 +44,14 @@ @@ -44,13 +44,14 @@
44 <MenuItem name="5-4">Option 12</MenuItem> 44 <MenuItem name="5-4">Option 12</MenuItem>
45 </Submenu> 45 </Submenu>
46 </Menu> 46 </Menu>
47 - <!-- <Menu theme="dark" accordion @on-open-change="handleOpenChange"> 47 + <br/>
  48 + <Menu ref="menu2" theme="dark" accordion :open-names="openNames2" @on-open-change="handleOpenChange">
48 <template v-for="item in menuList"> 49 <template v-for="item in menuList">
49 <custem-menu-item v-if="item.children" :key="`menu-${item.name}`" :parent-item="item"></custem-menu-item> 50 <custem-menu-item v-if="item.children" :key="`menu-${item.name}`" :parent-item="item"></custem-menu-item>
50 <menu-item v-else :name="`${item.name}`" :key="`menu-${item.name}`">{{ item.name }}</menu-item> 51 <menu-item v-else :name="`${item.name}`" :key="`menu-${item.name}`">{{ item.name }}</menu-item>
51 </template> 52 </template>
52 </Menu> 53 </Menu>
53 - <Button @click="addNewItem">添加菜单项</Button> --> 54 + <Button @click="addNewItem">添加菜单项</Button>
54 <Button @click="changeActive">修改激活项</Button> 55 <Button @click="changeActive">修改激活项</Button>
55 <Button @click="setOpenNames">修改展开数组</Button> 56 <Button @click="setOpenNames">修改展开数组</Button>
56 <Menu mode="horizontal" theme="light" :active-name="activeName" @on-open-change="hc"> 57 <Menu mode="horizontal" theme="light" :active-name="activeName" @on-open-change="hc">
@@ -108,6 +109,7 @@ import custemMenuItem from &#39;./custem-menu-item.vue&#39; @@ -108,6 +109,7 @@ import custemMenuItem from &#39;./custem-menu-item.vue&#39;
108 data () { 109 data () {
109 return { 110 return {
110 openNames: ['1'], 111 openNames: ['1'],
  112 + openNames2: [],
111 menuList: [ 113 menuList: [
112 { 114 {
113 name: '111', 115 name: '111',
@@ -184,8 +186,10 @@ import custemMenuItem from &#39;./custem-menu-item.vue&#39; @@ -184,8 +186,10 @@ import custemMenuItem from &#39;./custem-menu-item.vue&#39;
184 }, 186 },
185 setOpenNames () { 187 setOpenNames () {
186 this.openNames = ['2', '3']; 188 this.openNames = ['2', '3'];
  189 + this.openNames2 = ['222', '222-222', '222-222-222', '222-222-222-111']
187 this.$nextTick(() => { 190 this.$nextTick(() => {
188 this.$refs.menu.updateOpened(); 191 this.$refs.menu.updateOpened();
  192 + this.$refs.menu2.updateOpened();
189 }) 193 })
190 }, 194 },
191 addNewItem () { 195 addNewItem () {
src/components/menu/menu.vue
  Show/Hide comments   View file @bae9f44
@@ -79,6 +79,9 @@ @@ -79,6 +79,9 @@
79 updateOpenKeys (name) { 79 updateOpenKeys (name) {
80 let names = [...this.openedNames]; 80 let names = [...this.openedNames];
81 const index = names.indexOf(name); 81 const index = names.indexOf(name);
  82 + if (this.accordion) findComponentsDownward(this, 'Submenu').forEach(item => {
  83 + item.opened = false;
  84 + });
82 if (index >= 0) { 85 if (index >= 0) {
83 let currentSubmenu = null; 86 let currentSubmenu = null;
84 findComponentsDownward(this, 'Submenu').forEach(item => { 87 findComponentsDownward(this, 'Submenu').forEach(item => {
@@ -87,11 +90,14 @@ @@ -87,11 +90,14 @@
87 item.opened = false; 90 item.opened = false;
88 } 91 }
89 }); 92 });
  93 + findComponentsUpward(currentSubmenu, 'Submenu').forEach(item => {
  94 + item.opened = true;
  95 + });
90 findComponentsDownward(currentSubmenu, 'Submenu').forEach(item => { 96 findComponentsDownward(currentSubmenu, 'Submenu').forEach(item => {
91 item.opened = false; 97 item.opened = false;
92 }); 98 });
93 } else { 99 } else {
94 - if (this.mode === 'horizontal' && this.accordion) { 100 + if (this.accordion) {
95 let currentSubmenu = null; 101 let currentSubmenu = null;
96 findComponentsDownward(this, 'Submenu').forEach(item => { 102 findComponentsDownward(this, 'Submenu').forEach(item => {
97 if (item.name === name) { 103 if (item.name === name) {