下拉列表框
使用el-select或el-tree-select组件,用于在选项较多的情况下,以列表形式展示内容供其选择,该组件通常用于绘制代码表。支持编辑器类型包含:下拉列表框
、下拉列表框(100宽度)
、下拉列表框(多选)
示例效果
输入参数
名称 | 说明 | 类型 | 默认值 |
---|---|---|---|
value | 编辑器值 | [String, Number] | - |
controller | 编辑器控制器对象 | new RequiredProp(Object as PropType<C>) | - |
data | 容器数据,通常为表单数据,表格行数据,面板数据 | new RequiredProp(Object as PropType<IData>) | - |
disabled | 是否禁用 | { type: Boolean } | false |
readonly | 是否只读 | { type: Boolean, default: false } | false |
autoFocus | 是否自动聚焦 | { type: Boolean, default: false } | false |
controlParams | 容器控件参数,一般是指表单部件控件参数、表格控件参数、面板控件参数 | { type: Object, required: false } | - |
事件
名称 | 说明 | 类型 |
---|---|---|
change | 值变更事件 | {_value:V, _name?:string, _ignore?:boolean} |
blur | 失焦事件 | {_event?:IData} |
focus | 聚焦事件 | {_event?:IData} |
enter | 回车事件 | {_event?:IData} |
infoTextChange | 信息文本变更事件 | {_text:string} |
编辑器参数
名称 | 说明 | 类型 | 默认值 |
---|---|---|---|
forceselection | 是否禁止用户创建选择项。当参数为false时,可在输入框输入内容,使其显示在下拉选项中呈现,并且可选择 | boolean | true |
defaultfirstoption | 默认选中第一个,在该属性为 true 的情况下,按下回车就可以选中当前选项列表中的第一个选项,无需使用鼠标或键盘方向键进行定位 | boolean | false |
blankitemname | 在单选模式下,用于在下拉展示数据顶部添加一条空白项数据,其文本内容为配置的该参数值 | string | undefined |
alwaysload | 当值改变、下拉框出现时,是否重新加载代码表数据。设置为 true 时每次相关事件触发都会重新加载数据 | boolean | false |
type | 下拉框选项的样式类型,可取值为 'round'(圆角类型)或 'other'(其他类型) | 'round' | 'other' | 'other' |
overflowmode | 用于控制该编辑器下拉区域的宽度显示方式。当参数值为 'auto' 时,下拉区域宽度会根据内容自动展开;当参数值为 'ellipsis' 时,下拉区域宽度将与输入框保持一致,若内容超出宽度则会显示省略号,鼠标悬浮在内容上时会出现提示信息 | 'auto' | 'ellipsis' | 'auto' |
allitems | 下拉列表框是否启用全部项 | boolean | false |
itemstext | 下拉列表框全部项文本 | string | '全部' |
valueseparator | 下拉列表框值分隔符,用于多选时,拼接多个选项值为字符串和分割字符串为选项值数组 | string | ',' |
readonly | 设置编辑器是否为只读态 | boolean | false |
valuetype | 编辑器的值类型 | string | undefined |