Segmented 分段控制器
在两个或多个互斥选项之间切换，比 Radio 更紧凑。
何时使用
- 视图切换（日 / 周 / 月）。
- 在多种相同类型的视图 / 数据集间切换。
基本使用
options 是字符串 / 数字数组，v-model 绑定当前选中值。
用对象选项
options 元素也可以是 { label, value, disabled, icon }。
不同尺寸
size：small / middle（默认）/ large。
块级宽度
block 让组件横向占满父容器。
禁用整组
disabled 让所有选项不可点。
监听变化
change 事件返回新值，可联动其他组件。
数字 value
options 元素是数字时，v-model 也按数字类型回传，适合评分 / 年龄段 / 分页大小等枚举数值。
带 icon 选项
icon 接 CSS class（与 Button 的 icon prop 同源），渲染在 label 文字前。
自定义渲染（default slot）
默认插槽接收 { option } scope，可以完全接管单项的渲染——头像 + 文字 + 副标题等组合，适合用户切换 / 团队切换场景。
单项禁用
把禁用粒度下沉到 option：仅特定值不可点，其余可点。注意与整组 disabled 互不冲突。
视图切换业务
最典型用法：切换视图模式联动主区域渲染逻辑。这里用文本占位代表实际的列表 / 看板 / 图表组件。
API
Props
| 参数 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| modelValue | string | number | '' | 选中值，支持 v-model |
| options | (SegmentedOption | string | number)[] | [] | 选项列表 |
| block | boolean | false | 撑满父容器 |
| disabled | boolean | false | 整组禁用 |
| size | 'small' | 'middle' | 'large' | 'middle' | 尺寸 |
SegmentedOption
| 字段 | 类型 | 说明 |
|---|---|---|
| label | string | 显示文字 |
| value | string | number | 必填，选中值 |
| disabled | boolean | 单项禁用 |
| icon | string | 自定义 icon class |
Events
| 事件名 | 回调签名 | 说明 |
|---|---|---|
| change | (value: string | number) | 切换时触发 |