下拉单选框

简介

下拉单选框组件是一种用于提供可选项列表的 UI 元素,支持从多个选项中选择一项,广泛应用于表单填写、筛选条件设置等场景。

image

配置项

分类

配置

示例

说明

内容

选项列表

image

image

可手动或者映射配置,其中手动配置可直接配置每个 item,映射配置需配置数据源(数组),每个 item 包含 label 和 value 2 个属性。

默认值

image

默认选中选项

占位内容

image

占位内容

标签

imageimage

表单标签 ,详情参见表单通用属性

交互

隐藏

image

隐藏,详情参见通用属性

搜索

image

显示搜索图标

加载

image

显示加载动画

禁用

image

开启后,组件不可使用

校验

image

表单校验,详情参见表单通用属性

样式

外边距

image

外边距,详情参见通用属性

清除按钮

image

是否显示清除按钮

形态变体

image

各种形态变体,不同形态的可添加的 CSS 样式可能有所不同

空状态文案

image

下拉选项列表为空时的文案

CSS 样式

圆角

image

圆角

选项字体大小

image

下拉选项字体大小

主题字体大小

image

主题字体大小

标签字体大小

image

标签字体大小

属性与方法

名称

类型

示例

说明

value

string

select.value

组件的选中内容

labelText

string

select.labelText

组件的标签文字内容

selectedLabel

string

select.selectedLabel

组件的选中内容的标题

disabled

boolean

select.disabled

是否禁用

loading

boolean

select.loading

组件是否处于加载状态

data

array

select.data

组件选项列表

hidden

boolean

select.hidden

组件是否隐藏

validationStatus

boolean

select.validationStatus

组件校验后的状态

validationMessage

string

select.validationMessage

组件校验后的信息

blur

func

select.blur()

组件失去焦点

focus

func

select.focus()

组件获得焦点

validate

func

select.validate()

组件校验

setValue

func

select.setValue('')

设置组件的内容

setDisabled

func

select.setDisabled(true)

设置组件是否禁用

setHidden

func

select.setHidden(true)

设置组件的隐藏状态

clearValue

func

select.clearValue()

清除组件的 value 值

clearHidden

func

select.clearHidden()

清除组件的 hidden 值

clearValidate

func

select.clearValidate()

清除组件的校验信息

事件回调

配置

说明

image

组件的值发生改变后触发的事件