当前位置: 首页 > news >正文

前端学习笔记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>

相关文章:

  • GaussDB(PostgreSQL)查询执行计划参数解析技术文档
  • 嵌入式学习的第二十六天-系统编程-文件IO+目录
  • AJAX get请求如何提交数据呢?
  • 阿里巴巴 MCP 分布式落地实践:快速转换 HSF 到 MCP server
  • Ajax01-基础
  • 数据仓库工具箱第三版——读书笔记(未完)
  • jvm安全点(五)openjdk17 c++源码垃圾回收之安全点阻塞状态线程在安全点同步中无需调用block函数的详细流程解析
  • Origin绘制多因子柱状点线图
  • 鸿蒙Flutter实战:24-混合开发详解-4-初始化Flutter
  • uniapp打包报错:重新在manifest.json中生成自己的APPID
  • Java-根据路径获取JSON字符串的value值
  • 程序代码篇---Pytorch实现LATM+APF轨迹预测
  • MySQL安全加固:权限管控与加密实践
  • python实现web请求与回复
  • Oracle 11G RAC重启系统异常
  • Android-ViewModel+LiveData学习总结
  • flutter 项目调试、flutter run --debug调试模式 devtools界面说明
  • 结构性断裂:中年失业潮与婚姻解体的崩溃逻辑
  • 使用 vip 加入两台 master 节点
  • 精益数据分析(77/126):问题-解决方案画布——创业团队的周度聚焦与迭代利器
  • 网站开发培训哪个好/百度推广是什么工作
  • 寻花问柳-一个专做男人的网站/阿拉善盟seo
  • 做网站用空间好还是服务器好/网站排名优化外包公司
  • 网站用什么技术实现/企业网站模板源码
  • 国外自助建站/收录之家
  • 镇江建设银行网站/外链网