# Select 选择器

用于收纳大量选项的信息录入类组件。

# 代码演示

# API

# Select Attributes

参数 说明 类型 可选值 默认值 Version
allow-create 是否允许用户创建新条目,需配合 filterable 使用 Boolean — false
autocomplete select 中输入框的 autocomplete 属性 String — —
automatic-dropdown 对于不可搜索的 Select,是否在输入框获得焦点后自动弹出选项菜单 Boolean — false
clearable 是否可以清空选项 Boolean — false
collapse-tags 多选时是否将选中值按文字的形式展示 Boolean — false
disabled 是否禁用 Boolean — false
default-first-option 在输入框按下回车,选择第一个匹配项。需配合 filterable 或 remote 使用 Boolean — false
filterable 是否可搜索 Boolean — false
filter-method 自定义搜索方法 Function — —
loading 是否正在从远程获取数据 Boolean — false
loading-text 远程加载时显示的文字 String — 加载中
multiple 是否多选 Boolean — false
show-checkbox 多选模式下配置复选框和全选功能 Boolean — - V2.2.10
multiple-limit 多选时用户最多可以选择的项目数,为 0 则不限制 Number — 0
name select 中输入框的 name 属性 String — —
no-match-text 搜索条件无匹配时显示的文字 String — 无匹配数据
no-data-text 选项为空时显示的文字 String — 无数据
placeholder 占位符 String — 请选择
popper-class Select 下拉框的类名 String — —
popper-append-to-body 是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false Boolean — true
remote 是否为远程搜索 Boolean — false
remote-method 远程搜索方法 Function — —
reserve-keyword 多选且可搜索时,是否在选中一个选项后保留当前的搜索关键词 Boolean — false
size 输入框尺寸 String 'medium' | 'small' | 'mini' —
show-folded-tags 是否开启气泡展示折叠选项的功能 Boolean — true v1.7.5
tags-threshold 开启多选且折叠标签时,超过该阈值的选项将被折叠 Number — 1 v1.7.0
value / v-model 绑定值 String | Number | Boolean | Object — —
value-key 作为 value 唯一标识的键名,绑定值为对象类型时必填 String — value
draggable-tag 开启 multiple 且不合并情况下可以配置拖拽已选中 tag 顺序 Boolean true/false - v2.2.9
mode 分组模式(横向分组模式仅在单选情况下有效) String 'vertical' | 'vertical' 'horizontal' V2.2.10
suffix-icon 自定义尾部图标的类名(此时尾部禁止点击打开面板) String — V2.3.1
clear-filterable 是否在搜索、远程搜索下开启当当输入框失去焦点且搜索框值为空时清空上一次的搜索结果 Boolean — false v2.3.2
select-on-press-enter 是否在面板上开启回车选中 Boolean — true v2.3.6

# Select Events

事件名称 说明 回调参数 Version
blur 当 input 失去焦点时触发 (event: Event)
change 选中值发生变化时触发 目前的选中值
clear 可清空的单选模式下用户点击清空按钮时触发 —
focus 当 input 获得焦点时触发 (event: Event)
remove-tag 多选模式下移除 tag 时触发 移除的 tag 值
visible-change 下拉框出现/隐藏时触发 出现则为 true,隐藏则为 false
tag-drag-start tag 开始拖拽时触发的事件 event V2.2.9
tag-drag-end tag 拖拽结束时触发的事件 event、绑定值 V2.2.9
select-all 当用户手动勾选全选 Checkbox 时触发的事件 selection V2.3.6

# Select Slots

name 说明 Version
— Option 组件列表
prefix Select 组件头部内容
empty 无选项时展示的内容 v2.0.0
dropdown-header 下拉框头部插槽 v2.0.0
dropdown-footer 下拉框底部插槽 v2.0.0

# Option Group Attributes

参数 说明 类型 可选值 默认值 Version
disabled 是否将该分组下所有选项置为禁用 Boolean — false
label 分组的组名 String — —

# Option Attributes

参数 说明 类型 可选值 默认值 Version
disabled 是否禁用该选项 Boolean — false
label 选项的标签,若不设置则默认与 value 相同 String | Number — —
value 选项的值 String | Number | Object — —

# Methods

方法名 说明 参数 Version
blur 使 input 失去焦点,并隐藏下拉框 —
focus 使 input 获取焦点 —
上次更新: 3/29/2024, 10:28:32 AM