Skip to content

Toolbar 工具栏

工具按钮组容器:role="toolbar" + aria-labelTab 进入后方向键在按钮间移动(roving tabindex,只聚焦当前项)。

基础用法

基础用法(原生按钮)

与 oas-button 组合

slot 里放 oas-button(自定义元素自动参与 roving),用 data-toolbar-ignore 排除分隔元素。

oas-button + 分隔

剪切复制粘贴撤销重做

禁用项

disabled / aria-disabled 的按钮不参与方向键导航(roving 跳过)。

禁用项

API

插槽

名称说明
默认
  • 宿主 role="toolbar"aria-label 走 locale key(toolbar.label,默认「工具栏」)
  • 参与 roving 的子元素:native 控件(button/input/select/textarea/a[href])、交互 role、自定义元素(tag 含 -);用 data-toolbar-ignorearia-hidden 排除,disabled/aria-disabled 自动跳过
  • 键盘:Tab 进入(仅当前项可 Tab 到达),/(或 /)在按钮间移动,Home/End 跳转首末