vue elementUI use v-for Create three level navigation bar

<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"> <!-- First level menu
--> <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>
<!-- Secondary menu --> <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> <!--
Three level menu --> <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>```

• « 上一篇：python code , Easy to complete Snake games
• » 下一篇： Record a million data SQL Statement optimization