Skip to content

选择器

当选项过多时,使用下拉菜单展示并选择内容。

基础用法

适用广泛的基础单选 v-model 的值为当前被选中的 option 的 value 属性值。

loading

键盘操作

支持使用键盘进行快捷操作,Enter打开选项栏、Up/Down切换选中选项、Enter选中选项、ESC关闭下拉选项框

loading

自定义模板

自定义插入选项模板进行渲染

loading

过滤

可通过输入关键词进行过滤

loading

远程请求选项

可通过请求远程资源获取选项(该示例使用的是github网址,国内访问可能被拒绝)

loading

Select Interface

NameDescriptionType
SelectOption选择框选项{label:string; value:string;disabled:boolean}

Select Attributes

NameDescriptionTypeDefault
modelValue选择框绑定值string
options选项SelectOption
placeholder选择框提示内容string
clearable选择框是否可清除booleanfalse
disabled选择框是否禁用booleanfalse
renderLable选择框选项渲染函数(option)=>VNode
filterable选择框是否可输入过滤string
filterMethod选择框过滤方法(string)=>SelectOption[]
remote是否使用远程请求填充选项boolean
remoteMethod远程请求方法(string)=>Promise<SelectOption[]>

Select Events

NameDescriptionInputOutput
update:modelValue选择框文本更新触发value:stringvoid
change选择框文本变化并且失去focus触发value:stringvoid
visible-change选择框选项可见性切换时触发value:booleanvoid
clear选择框clear时触发voidvoid