简介
横向导航组件是以水平排列的方式展示导航选项,便于用户快速访问网站或应用中的主要页面和功能。

配置项
分类 | 配置 | 示例 | 说明 |
内容 | 模式 |
| 导航项模式,支持可视化和数据源。 |
导航项 |
| 当模式为可视化时生效,可以通过直观操作实现数据的新增、删除和修改。 | |
数据源 |
| 当模式为数据源时生效、动态的可以支持多级、可以通过 | |
Logo 图片来源 |
| Logo 图片资源的三种模式。 | |
Logo 图片地址 |
| 当 Logo 图片来源为 URL 时生效,值为 Logo 图片的链接。 | |
系统文件 |
| 当 Logo 图片来源为系统文件时生效,可以选择在内置资源文件中上传的图片,也可以点击下方选框直接上传。 | |
内存对象 |
| 当 Logo 图片来源为内存对象时生效,可以与上传组件关联使用,例如: | |
交互 | 隐藏 |
| 控制导航的默认展示状态,为 |
禁用 |
| 控制导航的禁用状态,为 | |
样式 | 外边距 |
| 导航组件的外边距,详情参见通用属性。 |
主题 |
| 导航组件的主题,默认为亮色。 | |
CSS 样式 | 文字大小 |
| 导航项文字的字体大小。 |
背景颜色 |
| 导航组件的背景颜色。 | |
子菜单背景颜色 |
| 导航组件的子级菜单背景颜色。 | |
菜单项文字颜色 |
| 导航项的文字颜色。 | |
菜单项文字禁用颜色 |
| 菜单项被禁用时的文字颜色 | |
子菜单悬浮态背景色 |
| 鼠标指针悬停在菜单项上时的背景颜色,仅对子菜单生效。 | |
菜单项文字悬浮颜色 |
| 鼠标指针悬停在菜单项时的文字颜色 | |
子菜单选中态背景色 |
| 当前菜单项被选中时的背景颜色,仅对子菜单生效。 | |
菜单项文字选中颜色 |
| 当前菜单项被选中时的文字颜色。 | |
子菜单激活态背景色 |
| 用于反馈用户点击菜单项瞬间的背景颜色变化,仅对子菜单生效 | |
暗色模式下的背景色 |
| 暗色模式下,导航组件的背景颜色。 | |
暗色模式下的子菜单背景颜色 |
| 暗色模式下,导航组件的子级菜单背景颜色。 | |
暗色模式下的菜单项文字颜色 |
| 暗色模式下,导航项的文字颜色。 | |
暗色模式下的菜单项文字禁用颜色 |
| 暗色模式下,菜单项被禁用时的文字颜色。 | |
暗色模式下的子菜单项悬浮态背景色 |
| 暗色模式下,鼠标指针悬停在菜单项上时的背景颜色,仅对子菜单生效。 | |
暗色模式下的菜单项文字悬浮颜色 |
| 暗色模式下,鼠标指针悬停在菜单项时的文字颜色 | |
暗色模式下的子菜单项选中态背景色 |
| 暗色模式下,当前菜单项被选中时的背景颜色,仅对子菜单生效。 | |
暗色模式下的菜单项文字选中颜色 |
| 暗色模式下,当前菜单项被选中时的文字颜色。 |
属性与方法
名称 | 类型 | 示例 | 说明 |
items | array |
| 只读,可视化模式下的导航数据 |
dataSource | array |
| 只读,数据源模式下的导航数据 |
disabled | boolean |
| 导航的禁用状态 |
setDisabled | func |
| 设置当前导航组件的禁用状态,为 |
clearDisabled | func |
| 清除当前导航组件的禁用状态 |





























