前端学习笔记element-Plus

【element-plus菜单】参数说明： 

  active-text-color="#ffd04b"——激活颜色

 background-color="#232323"——背景颜色（29,160,176）
 :default-active="$route.path"——配置默认高亮的菜单项
 text-color="#fff"
 router  router选项开启，el-menu-item 的 index 就是点击跳转的路径

el-menu-item 菜单项

      index="/article/channel" 配置的是访问的跳转路径，配合default-active的值，实现高亮

Element PLus官方网址：Container 布局容器 | Element Plus

 Element PLus官方网址：Menu 菜单 | Element Plus (element-plus.org)

导航菜单默认为垂直模式，通过将 mode 属性设置为 horizontal 来使导航菜单变更为水平模式。

 <el-menuactive-text-color="#ffd04b"background-color="#232323":default-active="$route.path"text-color="#fff"router><el-menu-item index="/article/channel"><el-icon><Management /></el-icon><span>文章分类</span></el-menu-item><el-menu-item index="/article/manage"><el-icon><Promotion /></el-icon><span>文章管理</span></el-menu-item><el-sub-menu index="/user"><!-- 多级菜单的标题 - 具名插槽 title --><template #title><el-icon><UserFilled /></el-icon><span>个人中心</span></template><!-- 展开的内容 - 默认插槽 --><el-menu-item index="/user/profile"><el-icon><User /></el-icon><span>基本资料</span></el-menu-item><el-menu-item index="/user/avatar"><el-icon><Crop /></el-icon><span>更换头像</span></el-menu-item><el-menu-item index="/user/password"><el-icon><EditPen /></el-icon><span>重置密码</span></el-menu-item></el-sub-menu></el-menu>