组件 · 操作 · 原生 HTML 与 React
按钮组 ButtonGroup
几个并列的按钮拼成一条:同一件事的几种做法。
演示
<div class="xxd-btn-group"><button class="xxd-btn" data-size="sm">左</button><button class="xxd-btn" data-size="sm">右</button></div>export function ButtonGroupDemo() {
return (
<ButtonGroup>
<Button size="sm">左</Button>
<Button size="sm">中</Button>
<Button size="sm">右</Button>
</ButtonGroup>
);
}属性与类名
| 属性 / 类名 | 说明 |
|---|---|
| 类名 | xxd-btn-group |
键盘与读屏
- 是一组互斥选项时改用分段控件(radiogroup),不要用按钮组
- 需要时给外层 role="group" 和 aria-label