下拉复选
介绍
当用户需要从一组同类数据中选择一个或多个时,可以使用下拉选择器,点击后选择对应项。
API
Props
Props 属性
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
默认状态 | 组件的状态, "默认"|"隐藏"|"禁用"|"只读" | string | 'default' |
标题 | 组件的的标题内容 | string | '' |
显示标题 | 控制标题的显示隐藏状态 | boolean | true |
默认值 | 组件的已选值 | string[] | - |
占位提示 | 组件的无已选值时,显示的展位提示内容 | string | - |
字段占比 | 组件宽度在父容器中的占比,"25%"|"50%"|"75%"|"100%" | string | - |
数据字段 | 组件对应在表单中的字段名 | string | - |
可搜索 | 是否开启选项搜索功能 | boolean | false |
下拉框宽度自适应 | 是否开启下拉框宽度自适应 | boolean | false |
最大选择数量 | 可选择选项的最大数量 | number | false |
清除按钮 | 是否显示清除按钮 | boolean | false |
彩色 | 是否开启选项及选择结果以不同颜色呈现 | boolean | false |
选项配置 | 配置可选项 | Record<string,any>[] | - |
指定字段名 | 配置key与title对应的字段名 | Record<string,any> | {"key": "key","title": "value"} |
Props 样式
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
自定义样式 | 表格整体自定义样式 | string | - |
盒子模型属性设置 | 设置组件的盒子模型相关的各项样式属性值,包括margin、border、padding | - | - |
边框颜色 | 设置边框颜色深度,可选"浅"|"一般"|"深/悬浮"|"重/按钮描边" | string | - |
边框线形 | 设置边框线的类型,可选"实线"|"点线"|"虚线" | string | - |
最多显示标签数量 | 已选值标签的最大显示数量,超过的部分省略显示 | number | - |
Props 高级
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
唯一标识 | 组件的唯一标识 | string | - |
补充说明 | 组件下方的说明性文字 | string | - |
气泡提醒 | 组件旁边图标悬浮显示的说明性文字 | string | - |
必填校验 | 是否开启组件值的必填校验 | boolean | false |
自定义函数校验 | 是否开启组件值的自定义函数形式的校验 | boolean | false |
循环 | 循环渲染设置 | - | - |
Events
Events 属性
事件名 | 说明 | 回调参数 |
---|---|---|
onChange | 值发生改变时触发 | ctx, params: { value:string[];rowData:any |
onSearch | 搜索时触发 | ctx, params: { value:string;rowData:any |
onClear | 点击清除按钮时触发 | ctx, params: PointerEvent |
onRemove | 移除标签时触发 | ctx, params: { removed:string } |
onInputValueChange | 搜索输入框的值发生改变时触发 | ctx, params: { value:string;rowData:any |
onPopupVisibleChange | 下拉框显示状态改变时触发 | ctx, params: { visible:boolean;value:string;rowData:any |