|
@ -1,32 +1,32 @@ |
|
|
<template> |
|
|
<template> |
|
|
<el-menu :default-active="activeIndex" mode="horizontal" @select="handleSelect" class="menuBox"> |
|
|
<el-menu :default-active="activeIndex" mode="horizontal" @select="handleSelect" class="menuBox"> |
|
|
<template v-for="(item, index) in menuData"> |
|
|
<template v-for="(item, index) in menuData"> |
|
|
<component :index="prefix + '_' + index" v-if="item.children" is="el-submenu" class="menuItem" :class="{ 'menuActive': activeIndex.includes(prefix + '_' + index) }"> |
|
|
<component :index="prefix + '_' + index" v-if="item.children" is="el-submenu" class="menuItem" :class="{ 'menuActive': activeIndex && activeIndex.includes(prefix + '_' + index) }"> |
|
|
<template slot="title">{{ item.title }}</template> |
|
|
<template slot="title">{{ item.title }}</template> |
|
|
|
|
|
|
|
|
<!-- 第二层菜单 --> |
|
|
<!-- 第二层菜单 --> |
|
|
<template v-for="(item1, index1) in item.children"> |
|
|
<template v-for="(item1, index1) in item.children"> |
|
|
<component :index="prefix + '_' + index + '-' + index1" v-if="item1.children" is="el-submenu" :class="{ 'menuActive': activeIndex.includes(prefix + '_' + index + '-' + index1) }"> |
|
|
<component :index="prefix + '_' + index + '-' + index1" v-if="item1.children" is="el-submenu" :class="{ 'menuActive': activeIndex && activeIndex.includes(prefix + '_' + index + '-' + index1) }"> |
|
|
<template slot="title"> |
|
|
<template slot="title"> |
|
|
<p index="1">{{ item1.title }}</p> |
|
|
<p index="1">{{ item1.title }}</p> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<!-- 第三层菜单 --> |
|
|
<!-- 第三层菜单 --> |
|
|
<template v-for="(item2, index2) in item1.children"> |
|
|
<template v-for="(item2, index2) in item1.children"> |
|
|
<component :index="prefix + '_' + index + '-' + index1 + '-' + index2" is="el-menu-item" :class="{ 'menuActive': activeIndex.includes(prefix + '_' + index + '-' + index1 + '-' + index2) }">{{ |
|
|
<component :index="prefix + '_' + index + '-' + index1 + '-' + index2" is="el-menu-item" :class="{ 'menuActive': activeIndex && activeIndex.includes(prefix + '_' + index + '-' + index1 + '-' + index2) }">{{ |
|
|
item2.title }} |
|
|
item2.title }} |
|
|
</component> |
|
|
</component> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
</component> |
|
|
</component> |
|
|
<component :index="prefix + '_' + index + '-' + index1" v-else is="el-menu-item" :class="{ 'menuActive': activeIndex.includes(prefix + '_' + index + '-' + index1) }">{{ item1.title |
|
|
<component :index="prefix + '_' + index + '-' + index1" v-else is="el-menu-item" :class="{ 'menuActive': activeIndex && activeIndex.includes(prefix + '_' + index + '-' + index1) }">{{ item1.title |
|
|
}} |
|
|
}} |
|
|
</component> |
|
|
</component> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
</component> |
|
|
</component> |
|
|
<component :index="prefix + '_' + index" v-else is="el-menu-item" class="menuItem" |
|
|
<component :index="prefix + '_' + index" v-else is="el-menu-item" class="menuItem" |
|
|
:class="{ 'menuActive': activeIndex.includes(prefix + '_' + index) }">{{ |
|
|
:class="{ 'menuActive': activeIndex && activeIndex.includes(prefix + '_' + index) }">{{ |
|
|
item.title }} |
|
|
item.title }} |
|
|
</component> |
|
|
</component> |
|
|
</template> |
|
|
</template> |
|
|