Skip to content

Select 下拉选择框

规则

基础示例(单选)

Props 配置示例

多选

标签模式(tags)

整段禁用

可清空单选

小号 + 加载态

Events 事件示例

参考:Antdv Next Select

value:单选为 string | number;多选 / tags 为数组;labelInValue 时为对象。

Props

参数说明类型默认值版本
allowClear支持清除boolean |false-
autoClearSearchValue选中后清空搜索框(multiple/tags)booleantrue-
classes语义化 classRecord<SemanticDOM, string> | function--
defaultActiveFirstOption默认高亮第一项booleantrue-
disabled禁用booleanfalse-
dropdownClassName已废弃,用 classes.popup.rootstring--
dropdownMatchSelectWidth已废弃,用 popupMatchSelectWidthboolean | number--
dropdownRender已废弃,用 popupRenderfunction--
dropdownStyle已废弃,用 styles.popup.rootCSSProperties--
fieldNames自定义字段object见文档-
filterOption本地筛选boolean | functiontrue-
filterSort排序function--
getPopupContainer渲染父节点function() => document.body-
labelInValuevalue 包含 labelbooleanfalse-
listHeight列表高度number256-
loading加载中booleanfalse-
maxCount最多可选(multiple/tags)number--
maxTagCounttag 数量number | responsive--
maxTagPlaceholder隐藏 tag 占位VueNode | function--
maxTagTextLengthtag 文本长度number--
menuItemSelectedIcon多选选中图标VueNode--
modemultiple | tagsstring--
notFoundContent空列表内容VueNodeNot Found-
open展开boolean--
optionFilterProp过滤字段string | string[]value-
options数据化选项object[]--
optionRender自定义选项function--
placeholder占位string--
placement弹出位置见文档bottomLeft-
popupClassName已废弃string--
popupMatchSelectWidth同宽 / 虚拟滚动boolean | numbertrue-
popupRender下拉内容function--
prefix前缀VueNode--
removeIcon多选清除图标VueNode--
searchValue受控搜索文本string--
showSearch可搜索boolean | Object单选 false / 多选 true-
size尺寸large | middle | small--
status校验状态error | warning--
styles语义化 styleRecord<SemanticDOM, CSSProperties> | function--
suffixIcon后缀图标VueNodeDownOutlined-
tagRender自定义 tagfunction--
labelRender自定义选中 labelfunction--
tokenSeparators自动分词(tags)string[]--
value选中值string | number | array | object--
variant形态变体outlined | borderless | filled | underlinedoutlined-
virtual虚拟滚动booleantrue-

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-

FormCreate 是一个开源项目,基于 MIT 许可证发布,欢迎个人和企业用户免费使用