Skip to content

Menubar 应用菜单栏

桌面应用式顶部菜单条(文件 / 编辑 / 视图),点击 / 悬停展开子菜单(级联浮出),支持方向键、Alt 访问键与焦点陷阱。

基础用法

基础用法

尚未选择

禁用项与分组

子菜单内支持 disabledtype: "divider" 分隔线与 type: "group" 分组标题。

禁用项与分组

尚未选择

受控选中

value 属性受控(已列入 observedAttributes):外部 setAttribute('value', ...) 即时生效,选中项(勾选/高亮)同步到对应叶子项;组件内部点击也会写回 value(非受控通道),宿主可监听 oas-select 自行接管。

受控选中(value 属性)

选中「新建」选中「撤销」清除选中value: -

API

属性

属性说明类型默认值
items顶级菜单项 JSON(含子菜单 children)string[]
value受控选中值(外部改即时同步勾选;内部选中自动写回)string

事件

事件说明
oas-select选择某项,detail: { value }

MenubarItem 字段(继承 MenuItem):

字段说明类型
label菜单文字string
value选中值string
accessKeyAlt 访问键(单字符);缺省取 label 首个 ASCII 字母string
disabled禁用boolean
children子菜单项(可继续嵌套,级联向右浮出)MenubarItem[]

键盘:顶级 / 切换、/Enter 打开子菜单、Esc 关闭;子菜单内 / 移动、 进入级联、 返回父级;Home/End 跳转。Alt 单独按下聚焦菜单栏,Alt + 访问键 打开对应顶级菜单。子菜单打开时 Tab 在子项间循环(焦点陷阱),roving tabindex 只保留当前顶级项可 Tab 到达。