Gitee
Appearance
Dropdown 下拉组件
Dropdown 组件用来展示下拉内容。
基本用法
下拉组件类型
下拉值状态
下拉组件大小
下拉是否分开展示
禁用状态
图标下拉
下拉内容
下拉方向
事件
类型
typescript
type DropdownButtonType = 'primary' |a 'success' | 'warning' | 'danger' | 'info' | 'link' | 'secondary'
type DropdownButtonPosition = 'top' | 'bottom' | 'left' | 'bottom'
属性
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| title | string | '下拉示例' | 下拉按钮对应文字 |
| size | string | '' | 下拉按钮尺寸,small小号，large大号 ，空为中号。默认为空 |
| type | DropdownButtonType | 'primary' | 下拉按钮类型 |
| iconClass | string | '' | 图标样式 |
| splitButton | boolean | false | 下拉按钮是否分开展示 |
| position | DropdownButtonPosition | 'bottom' | 下拉框展示方向 |
| disabled | boolean | false | 下拉按钮是否禁用 |
| model | array as DropdownItem[] | [{ label: '项目一', value: 'XM1' }, { label: '项目二', value: 'XM2' }] | 下拉框内容 |
DropdownItem
| 属性名 | 类型 | 说明 |
|---|---|---|
| label | string | 必有属性，下拉项文本 |
| value | string、number | 必有属性， 下拉项值 |
| disabled | boolean | 是否禁用 |
| active | boolean | 是否处于当前选中状态 |
| divide | boolean | 下拉按钮是否分开展示 |
事件
| 事件名 | 类型 | 说明 |
|---|---|---|
| onSelect | EventEmitter<any> | 返回选中值 |