菜单配置

/src/menus.js文件中配置菜单数据,前端硬编码或异步加载菜单数据。

菜单特性

为了简化开发,让开发着专注于业务逻辑,系统对菜单进行了一些封装。

  • 菜单支持头部、左侧、头部+左侧三种布局方式,详见导航布局
  • 系统会基于路由path自动选中对应的菜单;
  • 无菜单对应的二级页面也可以选中相应父级菜单,详见系统路由
  • 左侧菜单会自动滚动到可视范围内;
  • 左侧菜单支持展开收起拖拽改变宽度
  • 页面标题、tab标签页标题、面包屑基于菜单状态自动生成,但也提供了对应的修改方式,详见页面开发
  • 通过菜单配置,支持内嵌iframe打开页面、a标签方式打开页面;

菜单字段说明

开发人员可以根据自己的需要,配置所需字段。

字段必须说明
key需要唯一
parentKey用于关联父级
path菜单对应的路由地址
text如果local对应的文案有效,将覆盖text,否则菜单默认使用text作为展示内容
icon菜单图标配置
url菜单对应会打开url对应的iframe页面,如果配置了url,path将无效
target配合url使用,菜单将为a标签 <a href={url} target={target}>{text}</a>
local国际化配置,系统在i18n.menu中获取对应的文案
order菜单排序,数值越大越靠前显示
type如果菜单数据中携带功能权限配置,type==='1' 为菜单,type==='2'为功能
code功能码,如果是type==='2',会用到此字段