Select 下拉选择框
规则
基础示例(单选)
Props 配置示例
多选
标签模式(tags)
整段禁用
可清空单选
小号 + 加载态
Events 事件示例
value:单选为 string | number;多选 / tags 为数组;labelInValue 时为对象。
Props
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|---|---|---|---|---|
| allowClear | 支持清除 | boolean | | false | - |
| autoClearSearchValue | 选中后清空搜索框(multiple/tags) | boolean | true | - |
| classes | 语义化 class | Record<SemanticDOM, string> | function | - | - |
| defaultActiveFirstOption | 默认高亮第一项 | boolean | true | - |
| disabled | 禁用 | boolean | false | - |
| dropdownClassName | 已废弃,用 classes.popup.root | string | - | - |
| dropdownMatchSelectWidth | 已废弃,用 popupMatchSelectWidth | boolean | number | - | - |
| dropdownRender | 已废弃,用 popupRender | function | - | - |
| dropdownStyle | 已废弃,用 styles.popup.root | CSSProperties | - | - |
| fieldNames | 自定义字段 | object | 见文档 | - |
| filterOption | 本地筛选 | boolean | function | true | - |
| filterSort | 排序 | function | - | - |
| getPopupContainer | 渲染父节点 | function | () => document.body | - |
| labelInValue | value 包含 label | boolean | false | - |
| listHeight | 列表高度 | number | 256 | - |
| loading | 加载中 | boolean | false | - |
| maxCount | 最多可选(multiple/tags) | number | - | - |
| maxTagCount | tag 数量 | number | responsive | - | - |
| maxTagPlaceholder | 隐藏 tag 占位 | VueNode | function | - | - |
| maxTagTextLength | tag 文本长度 | number | - | - |
| menuItemSelectedIcon | 多选选中图标 | VueNode | - | - |
| mode | multiple | tags | string | - | - |
| notFoundContent | 空列表内容 | VueNode | Not Found | - |
| open | 展开 | boolean | - | - |
| optionFilterProp | 过滤字段 | string | string[] | value | - |
| options | 数据化选项 | object[] | - | - |
| optionRender | 自定义选项 | function | - | - |
| placeholder | 占位 | string | - | - |
| placement | 弹出位置 | 见文档 | bottomLeft | - |
| popupClassName | 已废弃 | string | - | - |
| popupMatchSelectWidth | 同宽 / 虚拟滚动 | boolean | number | true | - |
| popupRender | 下拉内容 | function | - | - |
| prefix | 前缀 | VueNode | - | - |
| removeIcon | 多选清除图标 | VueNode | - | - |
| searchValue | 受控搜索文本 | string | - | - |
| showSearch | 可搜索 | boolean | Object | 单选 false / 多选 true | - |
| size | 尺寸 | large | middle | small | - | - |
| status | 校验状态 | error | warning | - | - |
| styles | 语义化 style | Record<SemanticDOM, CSSProperties> | function | - | - |
| suffixIcon | 后缀图标 | VueNode | DownOutlined | - |
| tagRender | 自定义 tag | function | - | - |
| labelRender | 自定义选中 label | function | - | - |
| tokenSeparators | 自动分词(tags) | string[] | - | - |
| value | 选中值 | string | number | array | object | - | - |
| variant | 形态变体 | outlined | borderless | filled | underlined | outlined | - |
| virtual | 虚拟滚动 | boolean | true | - |
Events
| 事件 | 说明 | 类型 | 版本 |
|---|---|---|---|
| active | 键盘/鼠标交互 | (value: string | number) => void | - |
| blur | 失焦 | (event: FocusEvent) => void | - |
| change | 值变化 | (value, option: Option | Option[]) => void | - |
| clear | 清除 | () => void | - |
| deselect | 取消选中(multiple/tags) | (value: string | number) => void | - |
| dropdownVisibleChange | 已废弃,用 openChange | (open: boolean) => void | - |
| focus | 聚焦 | (event: FocusEvent) => void | - |
| inputKeydown | 按键 | (event: KeyboardEvent) => void | - |
| openChange | 展开/收起 | (open: boolean) => void | - |
| popupScroll | 列表滚动 | (event: UIEvent) => void | - |
| search | 搜索文本变化 | (value: string) => void | - |
| select | 选中 | (value: string | number, option: Option) => void | - |


