ElementUi树形目录

一、树形目录

直接循环路由器 v-for="(item,index) in routers"

<el-menu 
    default-active="1-4-1" 
    class="el-menu-vertical-demo" 
    :collapse="isCollapse"
    background-color="transparent" 
    text-color="#fff" 
    active-text-color="#fff"	
    router 
    :unique-opened="true" >
    <template  v-for="(item,index) in routers">
      <el-submenu :index="index+''" :key="index" v-if="item.meta">
        <!-- 一级 -->
        <template slot="title">
           <svgIcon :iconClass="item.meta.icon" :className="item.meta.icon" />
          <!-- <i :class="'el-icon-'+item.meta.icon"></i>  -->
          <span slot="title">{{item.meta.name}}</span>
        </template>
        <!-- 二级 -->
        <template v-for="(subItem,subIndex) in item.children">
          <el-menu-item 
          v-if="!subItem.hidden"
          :key="subIndex" :index="subItem.path">
            {{subItem.meta.name}}
          </el-menu-item>
        </template>
      </el-submenu>
    </template>
    </el-menu>