element组件

• NavMenu 导航菜单 default-active：当前激活菜单的 index
  default-openeds:当前打开的 sub-menu 的 index 的数组
  unique-opened:是否只保持一个子菜单的展开
  menu-trigger:子菜单打开的触发方式(只在 mode 为 horizontal 时有效)
  router:是否使用 vue-router 的模式，启用该模式会在激活导航时以 index 作为 path 进行路由跳转
  collapse-transition:是否开启折叠动画

<el-container style="height: 100vh; border: 1px solid #eee">
    <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
      <!-- :default-openeds="['1', '3']" 表示默认打开第一个和第三个菜单 -->
      <!-- 1 对应了el-submenu index="1"
           2 对应了el-submenu index="2" -->
      <!-- el-submenu index="1-1 表示把el-submenu当作是第一个导航的第一个子项-->
      <!--  :router="true 使用 vue-router 的模式，启用该模式会在激活导航时以 index 作为 path 进行路由跳转 -->
      <!-- default-active="/index/users" -->
      <!-- ★  :default-openeds 不可以直接使用['1'] 需要使用一个变量openList代替 因为值随时会变 如果写的
      是['1'] 那么就永远不会改变 会出现点击二级菜单 一级菜单会缩起来的情况-->
      <!-- default-active="/index/users" 表示一进入页面就默认激活/index/user导航菜单 
      default-active不能直接写死值路径要用变量代替 使用监听器 监听路由解决 -->
      <!-- unique-opened	是否只保持一个子菜单的展开	boolean 默认是false-->
      <el-menu
        :default-openeds="openList"
        :router="true"
        :default-active="pagepath"
        :unique-opened="true"
      >
        <!-- index接收的字符串类型，(i+1)是数字类型，所以使用toString方法转成字符串 传给index -->
        <!-- 因为i是从0开始的 所以需要加1 -->
        <el-submenu
          :index="(i + 1).toString()"
          v-for="(v, i) in navList"
          :key="i"
        >
          <template slot="title"
            ><i class="el-icon-menu"></i>{{ v.authName }}</template
          >
          <!-- 子选项需要改成例如：1-1格式 以字符串的形式传给index属性 -->
          <!-- 因为子选项也是一个数组所以需要再次循环 -->
          <!-- :index="'/index/'+item.path" 路径最前面必须加上/ 否则会出现路径覆盖的问题 -->
          <el-menu-item
            :index="'/index/' + item.path"
            v-for="(item, index) in v.children"
            :key="index"
            >{{ item.authName }}</el-menu-item
          >
        </el-submenu>
      </el-menu>
    </el-aside>