no message

Former-commit-id: 4396ced1431e32cd9557670cdbf05ae1f0c1c523
Former-commit-id: 29b5a6853a3fbae9b1c1b748459784bad67d5479
Former-commit-id: 4c07578eac615e772a6732630204206f6759c86c
This commit is contained in:
liyang 2018-06-04 22:52:38 +08:00
parent ff2d262d66
commit 5a6fddef63
5 changed files with 19 additions and 39 deletions

View File

@ -2,10 +2,18 @@
局部组件是指在某个组件内注册的组件,它一般只在一个地方用到,全局无法访问
## dd-menu
## D2MenuItem
::: tip 出现位置
src/components/core/MainLayout/components/SideMenu/index.vue
:::
该组件会根据数据选择渲染 `<el-menu-item>` 或者 `<el-submenu>` 结构,并且在 `<el-submenu>` 中再次根据数据类型递归自身,最终生成 elementUI 的菜单组件结构,支持嵌套多级
该组件会根据数据渲染 `<el-menu-item>`
## D2Submenu
::: tip 出现位置
src/components/core/MainLayout/components/SideMenu/index.vue
:::
该组件会根据数据渲染 `<el-submenu>` 结构,并且在 `<el-submenu>` 中再次根据数据类型递归自身,最终生成 elementUI 的菜单组件结构,支持嵌套多级

View File

@ -7,7 +7,7 @@
<script>
export default {
name: 'dd-menu-item',
name: 'D2MenuItem',
props: {
menu: {
type: Object,

View File

@ -5,15 +5,15 @@
<span slot="title">{{menu.title}}</span>
</template>
<template v-for="(child, childIndex) in menu.children">
<ddMenuItem v-if="child.children === undefined" :menu="child" :key="childIndex"/>
<dd-menu-have-children v-else :menu="child" :key="childIndex"/>
<d2-menu-item v-if="child.children === undefined" :menu="child" :key="childIndex"/>
<d2-submenu v-else :menu="child" :key="childIndex"/>
</template>
</el-submenu>
</template>
<script>
export default {
name: 'dd-menu-have-children',
name: 'D2Submenu',
props: {
menu: {
type: Object,
@ -22,7 +22,7 @@ export default {
}
},
components: {
ddMenuItem: () => import('./ddMenuItem.vue')
D2MenuItem: () => import('./D2MenuItem.vue')
}
}
</script>

View File

@ -1,28 +0,0 @@
<template>
<div>
<el-menu-item v-if="menu.children === undefined" :index="menu.path">
<i :class="`fa fa-${menu.icon}`"></i>
<span slot="title">{{menu.title}}</span>
</el-menu-item>
<el-submenu v-else :index="menu.path">
<template slot="title">
<i :class="`fa fa-${menu.icon}`"></i>
<span slot="title">{{menu.title}}</span>
</template>
<dd-menu v-for="(child, childIndex) in menu.children" :menu="child" :key="childIndex"/>
</el-submenu>
</div>
</template>
<script>
export default {
name: 'dd-menu',
props: {
menu: {
type: Object,
required: false,
default: () => {}
}
}
}
</script>

View File

@ -5,8 +5,8 @@
:unique-opened="true"
:router="true">
<template v-for="(menu, menuIndex) in menus">
<ddMenuItem v-if="menu.children === undefined" :menu="menu" :key="menuIndex"/>
<dd-menu-have-children v-else :menu="menu" :key="menuIndex"/>
<d2-menu-item v-if="menu.children === undefined" :menu="menu" :key="menuIndex"/>
<d2-submenu v-else :menu="menu" :key="menuIndex"/>
</template>
</el-menu>
<!-- <div v-if="sideMenu.filter(e => e.title).length === 0 && !collapse" class="dd-side-menu-empty">
@ -25,8 +25,8 @@ export default {
}
},
components: {
ddMenuItem: () => import('./components/ddMenuItem.vue'),
ddMenuHaveChildren: () => import('./components/ddMenuHaveChildren.vue')
D2MenuItem: () => import('./components/D2MenuItem.vue'),
D2Submenu: () => import('./components/D2Submenu.vue')
},
data () {
return {