elementUI Navmenu侧边栏导航菜单实现

为网站提供导航功能的菜单。

<el-menu

              background-color="#333744"
              text-color="#fff"
              active-text-color="#409eff">
<!--            一级菜单-->
            <el-submenu :index="item.id+''" v-for="item in menuList" :key="item.id">
<!--              一级菜单模板区-->
                    <template slot="title">
                      <i class="el-icon-location"></i>
                      <span>{{item.authName}}</span>
                    </template>
                      <el-menu-item :index="subItem.id+''" v-for="subItem in item.children" :key="subItem.id">
                        <template slot="title">
                          <i class="el-icon-menu"></i>
                          <span>{{subItem.authName}}</span>
                        </template>
                      </el-menu-item>

            </el-submenu>

          </el-menu>

menulist的格式：

效果：