vue elementUI使用v-for创建三级导航栏
<el-menu class="sidebar-el-menu" :default-active="onRoutes" :collapse="collapse" background-color="#eeefef" text-color="#666" active-text-color="#20a0ff" unique-opened router @select="addTab">..
·
<el-menu class="sidebar-el-menu" :default-active="onRoutes" :collapse="collapse" background-color="#eeefef" text-color="#666" active-text-color="#20a0ff" unique-opened router @select="addTab">
<!-- 一级菜单 -->
<template v-for="item in slidebarData" >
<el-submenu v-if="item.subs && item.subs.length" :index="item.index" :key="item.index">
<template slot="title"><i :class="item.icon"></i><span>{{item.title}}</span></template>
<!-- 二级菜单 -->
<template v-for="itemChild in item.subs">
<el-submenu v-if="itemChild.subs && itemChild.subs.length" :index="itemChild.index" :key="itemChild.index" class="erji">
<template slot="title"><i :class="itemChild.icon"></i><span>{{itemChild.title}}</span></template>
<!-- 三级菜单 -->
<el-menu-item v-for="itemChild_Child in itemChild.subs" :index="itemChild_Child.index" :key="itemChild_Child.index">
<i :class="itemChild_Child.icon"></i><span slot="title">{{itemChild_Child.title}}</span>
</el-menu-item>
</el-submenu>
<el-menu-item v-else :index="itemChild.index" :key="itemChild.index"><i :class="itemChild.icon"></i><span slot="title">{{itemChild.title}}</span></el-menu-item>
</template>
</el-submenu>
<el-menu-item v-else :index="item.index" :key="item.index"><i :class="item.icon"></i><span slot="title">{{item.title}}</span></el-menu-item>
</template>
</el-menu>```
更多推荐
已为社区贡献3条内容
所有评论(0)