组件/表单组件

ECascader 级联选择

import EUI 1.0

示例与代码

级联选择

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 Column { width: Math.min(640, parent.width) spacing: 16 ECascader { emitPath: true multiple: true filterable: true collapseTags: true maxCollapseTags: 2 nodeDelegate: Component { EText { text: parent.node.label } } options: [{label: qsTr("中国"), value: "cn", children: [ {label: qsTr("浙江"), value: "zj", children: [{label: qsTr("杭州"), value: "hz"}, {label: qsTr("宁波"), value: "nb"}]}, {label: qsTr("上海"), value: "sh"}]}] } }

效果

运行代码，体验组件交互

可修改文字、属性和事件，再点击运行。

代码在当前浏览器中运行 许可

级联选择

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 ECascader { options: exampleData.models.Regions value: exampleData.models.InitialRegion }

效果

运行代码，体验组件交互

可修改文字、属性和事件，再点击运行。

代码在当前浏览器中运行 许可

属性

属性说明取值与默认值

accessibleNamestring

辅助技术读取的名称；建议为无文字控件设置可读名称。

默认值placeholderText

appendComponentComponent

自定义输入附加区或列表尾部的 Component 插槽；null 使用默认内容。 委托上下文见本页示例。

默认值null

checkStrictlybool

选中状态不随父子节点联动。

默认值false

childrenRolestring

数据对象中用于文字、取值、子节点或缩进的字段名。

默认值"children"

clearIconint

组件使用的图标。

EIcons.*
0（无图标）

默认值EIcons.CIRCLE_XMARK

clearablebool

显示清除操作；评分中允许再次点击当前分数清零。

默认值true

collapseTagsbool

折叠过多的已选标签。

默认值false

echoModeenum

输入内容的显示模式。

TextInput.Normal
TextInput.Password
TextInput.NoEcho
TextInput.PasswordEchoOnEdit

默认值动态绑定

emitPathbool

级联选择输出完整路径；false 时输出末级值。

默认值true

emptyValuesvar

判定为空值的数组；默认包含 undefined、null 和空字符串。

默认值继承 Provider，默认 [undefined, null, ""]

enabledbool

是否允许交互；false 时控件禁用。

默认值true

expandTriggerstring

展开级联节点的触发方式。

"click" / "hover"

默认值"click"

filterMethodvar

自定义过滤函数；参数和返回值遵循当前组件的过滤调用。

默认值null

filterablebool

是否允许输入关键词过滤。

默认值false

fontfont

字体配置，控制字体、字号及文字样式。

常用字段：
family、pixelSize、pointSize
bold、italic、weight
underline、strikeout
letterSpacing、wordSpacing

默认值应用字体

formattervar

格式化回调，把当前值转换为显示文字。

默认值null

heightreal

组件尺寸，单位为像素；可绑定父布局尺寸。

默认值implicitHeight

labelRolestring

数据对象中用于文字、取值、子节点或缩进的字段名。

默认值"label"

lazybool

按需创建内容或加载数据；数据控件使用 load / lazyLoad。

默认值false

lazyLoadvar

懒加载回调，接收节点与 resolve；使用 resolve(children) 提供子节点。

默认值null

maxCollapseTagsint

折叠标签时直接显示的最大数量。

默认值1

maximumLengthint

最多允许输入的字符数。

默认值32767

multiplebool

是否允许多选。

默认值false

nodeDelegateComponent

自定义树或级联节点的 Component 插槽；null 使用默认内容。 委托上下文见本页示例。

默认值null

optionsvar

级联节点数组，角色属性可自定义字段映射。

字段：
label, value, children
disabled

默认值[]

parservar

输入解析函数，把显示文字转换为底层值。

默认值null

passwordVisiblebool

密码是否以明文显示。

默认值false

placeholderTextstring

空值时显示的占位文字。

默认值随当前语言变化

prefixComponentComponent

自定义前缀的 Component 插槽；null 使用默认内容。 委托上下文见本页示例。

默认值null

prefixIconint

组件使用的图标。

EIcons.*
0（无图标）

默认值0

prependComponentComponent

自定义输入前置区的 Component 插槽；null 使用默认内容。 委托上下文见本页示例。

默认值null

querystring

当前过滤或搜索关键词。

默认值""

readOnlybool

禁止用户编辑或评分，仍可通过属性设置值。

默认值true

separatorstring

路径或面包屑分隔文字。

默认值随当前语言变化

showPasswordbool

启用密码输入及密码显示切换。

默认值false

showWordLimitbool

显示当前字数与长度上限。

默认值false

sizeint

控件尺寸；默认继承最近的 EConfigProvider。

EStyle.Small
EStyle.Medium
EStyle.Large

默认值继承 Provider，默认 EStyle.Medium

styleTypeint

语义配色风格。

EStyle.Default
EStyle.Primary
EStyle.Success
EStyle.Info
EStyle.Warning
EStyle.Danger

默认值EStyle.Primary

suffixComponentComponent

自定义后缀的 Component 插槽；null 使用默认内容。 委托上下文见本页示例。

默认值null

suffixIconint

组件使用的图标。

EIcons.*
0（无图标）

默认值EIcons.CHEVRON_DOWN

textstring

显示的文字内容。

默认值selectedLabel

textColorcolor

文字颜色。

默认值动态绑定

validateEventbool

值变化时是否向所属表单派发校验请求。

默认值true

validationMessagestring

校验结果说明或外部错误文字。

默认值""

validationStateint

输入校验状态。

EValidationState.None
EValidationState.Success
EValidationState.Warning
EValidationState.Error

默认值EValidationState.None

valuevar

当前值；通过属性绑定读写，数组形式用于多选或范围选择。

默认值[]

valueOnClearvar

清除后的值，也可传函数返回清除值；默认继承配置。

默认值继承 Provider，默认 undefined

valueRolestring

数据对象中用于文字、取值、子节点或缩进的字段名。

默认值"value"

visiblebool

是否显示组件。

默认值true

widthreal

组件尺寸，单位为像素；可绑定父布局尺寸。

默认值implicitWidth

columnHeightreal只读

级联选项列计算后的高度。

默认值由运行时计算

effectiveOptionsvar只读

经过字段映射后的选项列表。

默认值由运行时计算

filteredPathsvar只读

级联选择按关键词筛选出的节点路径。

默认值由运行时计算

hasValidationErrorbool只读

当前校验状态是否为 Error。

默认值由运行时计算

nodePathsvar只读

级联数据中的完整节点路径数组。

默认值由运行时计算

popupalias只读

内部菜单、弹层或提示对象引用。

默认值别名：cascadePopup

selectedLabelstring只读

级联选择当前值的显示路径。

默认值由运行时计算

wordCountint只读

当前输入字符数量。

默认值由运行时计算

showPasswordStrengthbool

聚焦密码输入时显示强度与规则检查。

默认值false

passwordRulesvar

密码规则数组；每项包含 label 及 minLength 或 pattern。

默认值

展开默认值

[ {label: ELocale.texts.PasswordLength, minLength: 8}, {label: ELocale.texts.PasswordUppercase, pattern: /[A-Z]/}, {label: ELocale.texts.PasswordLowercase, pattern: /[a-z]/}, {label: ELocale.texts.PasswordNumber, pattern: /[0-9]/}, {label: ELocale.texts.PasswordSymbol, pattern: /[^A-Za-z0-9]/} ]

passwordStrengthreal只读

通过规则的比例，范围为 0 到 1。

默认值

展开默认值

passwordRequirements.length ? passwordRequirements.filter(function(rule) { return rule.passed }).length / passwordRequirements.length : 0

passwordRequirementsvar只读

包含 label 与 passed 的规则检查结果。

默认值

展开默认值

Array.isArray(passwordRules) ? passwordRules.map(function(rule) { let passed = false try { if (rule && rule.minLength !== undefined) passed = text.length >= Number(rule.minLength) else if (rule && rule.pattern) { const expression = new RegExp(rule.pattern) passed = expression.test(text) } } catch (error) { passed = false } return {label: rule && rule.label ? String(rule.label) : "", passed: passed} }) : []

信号

签名作用

selected(var value)

级联选择变化时触发，value 为选中的路径或路径集合。

loadFailed(string message)

加载数据失败时触发，message 为失败原因。

方法

签名作用

open()

打开组件的面板或弹窗。

isChecked(path)

判断指定项目是否勾选，返回布尔值。

clearSelection()

清除当前选择。

checkedState(path)

返回指定节点或路径的勾选状态，包括半选状态。

selectLevel(level, index, expandOnly)

选择指定层级的选项；expandOnly 为 true 时只展开下一级。

loadPath(path, resolved)

加载指定级联路径的子级数据；resolved 为加载结果回调。

checkPath(path, checked)

设置指定级联路径的勾选状态。