# Segmented 分段器 0.1.23
## 何时使用
* 用于展示多个选项并允许用户选择其中单个选项;
* 当切换选中选项时,关联区域的内容会发生变化。
## 大型分段器
通过设置 `size` 属性为 `"large"`,创建一个大型分段器。
```html
```
## 默认分段器
这是默认尺寸的分段器。
```vue
```
## 小型分段器
通过设置 `size` 属性为 `"small"`,创建一个小型分段器。
```html
```
## 带振动效果的分段器
通过设置 `vibrate-short` 属性为 `true`,使手机在切换选项时产生短暂振动。
```html
```
## 禁用分段器
通过设置 `disabled` 属性为 `true`,禁用分段器。
```html
```
## 自定义渲染分段器标签
使用插槽 `label` 可以自定义渲染分段器的标签内容。
```html
{{ option.value }}
```
```ts
const list1 = ref([
{
value: '李雷',
disabled: false,
payload: {
avatar: 'https://unpkg.com/wot-design-uni-assets/redpanda.jpg'
}
},
{
value: '韩梅梅',
disabled: false,
payload: {
avatar: 'https://unpkg.com/wot-design-uni-assets/capybara.jpg'
}
}
])
```
```scss
.section {
width: 100%;
padding: 0 24rpx;
box-sizing: border-box;
&-slot {
padding: 4px;
}
}
```
请注意,上述示例代码中的 `list` 和 `list1` 变量是您在 `