ToggleGroup 切换组

单选/多选互斥的按钮组：单选组用 radio 语义、多选组用 checkbox 语义，键盘方向键切换，受控 value。

单选

不设 multiple 时为单选（role="radiogroup" + radio），value 为字符串，同一时刻只有一项按下。

单选

当前：day

示例代码

多选

设置 multiple 后为多选（role="group" + checkbox），value 为 JSON 数组字符串。

多选

当前：[]

示例代码

禁用

项级 disabled: true 禁选；禁用项不参与键盘导航。

禁用项

示例代码

受控选中（value）

value 为受控通道：单选为字符串、多选为 JSON 数组字符串；外部设置属性即时反映到选中态（组内点击也会回写该属性）。以下用按钮外部驱动选中：

受控 value

单选：日单选：月多选：斜体+下划线

示例代码

预设 value="week" / value='["bold"]' 使两个组初始即带选中态；按钮外部写入 value 属性后选中态即时切换。

事件

点击或键盘切换派发 oas-change，单选 detail: { value: string }，多选 detail: { value: string[] }。

变化事件

oas-change: { value: "left" }

示例代码

API

属性

属性	说明	类型	默认值
items	选项 JSON（property 赋值单向反射 attribute）	ToggleItem[] | string	[]
multiple	多选模式（checkbox 语义）	boolean	—
value	当前值：单选为字符串；多选为 JSON 数组字符串	string	[]

事件

事件	说明
oas-change	切换，detail: { value: string | string[] }

ToggleItem 字段：

字段	说明	类型
label	按钮文案	string
value	值（随事件回传）	string
disabled	禁用该项	boolean

键盘：单选模式方向键移动并选中（radio 组惯例）；多选模式方向键移动焦点（roving tabindex）、Space/Enter 切换。容器 role="radiogroup" / role="group" + aria-label，选中项 aria-checked。