文档
http://element.eleme.io/#/zh-CN/component/menu
<!-- el菜单结构 -->
<el-menu default-active="1-4-1" class="el-menu-vertical-demo">
<el-submenu index="1">
<template slot="title">
<i class="el-icon-location"></i>
<span slot="title">导航一</span>
</template>
<el-submenu index="1-4">
<span slot="title">选项4</span>
<el-menu-item index="1-4-1">选项1</el-menu-item>
</el-submenu>
</el-submenu>
<el-menu-item index="2">
<i class="el-icon-menu"></i>
<span slot="title">导航二</span>
</el-menu-item>
</el-menu>
- 每个菜单有一个索引index唯一标识
- el-menu的属性
- default-active 默认选中的索引
- collapse
展开和关闭
:collapse="isCollapse"
问题点：
展开和关闭动画生硬
菜单结构
<!-- el菜单结构 -->
<el-menu default-active="0" :collapse="collapsed">
<el-submenu index="1">
<template slot="title">
<i class="el-icon-location"></i>
<span slot="title">系统菜单</span>
</template>
<el-menu-item index="1-1">
<i class="el-icon-message"></i>
<span slot="title">菜单管理</span>
</el-menu-item >
<el-menu-item index="1-2">
<i class="el-icon-message"></i>
<span slot="title">角色管理</span>
</el-menu-item >
<el-menu-item index="1-3">
<i class="el-icon-message"></i>
<span slot="title">用户管理</span>
</el-menu-item >
</el-submenu>
<el-submenu index="2">
<template slot="title">
<i class="el-icon-location"></i>
<span slot="title">文章管理</span>
</template>
<el-menu-item index="2-1">
<i class="el-icon-message"></i>
<span slot="title">文章分类</span>
</el-menu-item >
<el-menu-item index="2-2">
<i class="el-icon-message"></i>
<span slot="title">文章列表</span>
</el-menu-item >
<el-menu-item index="2-3">
<i class="el-icon-message"></i>
<span slot="title">回收站</span>
</el-menu-item >
</el-submenu>
<el-menu-item index="3">
<i class="el-icon-menu"></i>
<span slot="title">导航二</span>
</el-menu-item>
</el-menu>
</aside>
