跳到主要内容

数据绑定

数据绑定将画布组件与外部数据源关联,实现数据的实时读取和写入。组件通过绑定数据点获取实时值进行显示,输入类组件通过绑定将用户操作写回数据源。


数据字段类型

数据源中的每个字段有以下类型:

类型说明示例
数值 (number)数字类型,用于数值显示和计算42.50-100
布尔 (boolean)真/假,用于开关、状态指示truefalse
字符串 (string)文本类型"运行中""N/A"
枚举 (enum)结构化枚举,每个成员包含匹配值、显示标签和可选的下发值0=停止1=运行2=报警

枚举字段在显示时自动转换为用户可读的标签,在条件判断和公式计算中使用匹配值进行比较。


绑定方式

直接绑定

将数据字段的值直接赋给组件属性。组件实时读取该字段的值并更新显示。

  • 适用于:文本内容、图标切换、条件可见等
  • 示例:绑定 temperature 字段到文本组件的文本属性表单,文本自动显示当前温度值

表达式绑定

通过表达式引用一个或多个数据字段,经过计算后得到显示值。支持三种表达式:

模板表达式 — 文本插值,用 ${字段名} 引用变量:

当前温度:${temperature_field}℃
设备状态:${status_field}
  • 自动格式化:枚举字段显示为标签文本,数值保留原始值
  • 支持多个变量组合

条件表达式 — 返回布尔值,用于条件判断和条件可见:

${value_a} > 80
${value_b} == "运行"
!${flag_c}
  • 支持运算符:==!=>>=<<=&&||!
  • 支持括号分组
  • 枚举字段支持匹配值、下发值和标签文本的比较

公式表达式 — 返回数值,用于计算和阈值判断:

${value_a} + ${value_b}
${value_c} * 60 / ${value_d}
  • 支持运算符:+-*/%(取余)、**(幂)
  • 支持一元负号

条件可见

通过条件表达式控制组件的显示/隐藏,表达式结果为真时显示组件:

  • 需要启用"条件可见"开关
  • 仅在预览模式下生效,编辑模式下始终显示
  • 示例:${alarm_level_field} >= 2 — 仅在报警等级大于等于 2 时显示报警指示灯

绑定操作

数据绑定操作有两种——拖拽绑定 和 属性面板绑定

方式一:拖拽绑定

从数据面板中拖拽字段到画布中的组件上,弹出绑定配置面板,选择目标属性完成绑定。

方式二:属性面板绑定

选中组件后,在右侧属性面板中找到数据绑定相关字段,直接输入或选择数据字段。

不同组件类型支持绑定的属性不同,由组件持有的可绑定属性项定义:

组件类型可绑定的属性
文本内容表达式、条件可见
形状内容表达式、条件可见、闪烁/旋转/滚动动效条件
图标图标切换(直接绑定)、条件可见
图片图片地址、条件可见
日期时间条件可见
状态灯数据字段(直接绑定)、条件可见
进度条数据字段(直接绑定)、条件可见
输入框数据字段(读写)、条件可见
下拉选择数据字段(读写)、条件可见
按钮下发值表达式、条件可用、条件可见

数据下发

输入类组件(输入框、步进输入、滑块、下拉选择、开关、按钮等)通过绑定的数据点将用户操作写回数据源。

数据下发机制

关联组件与批量下发

下发按钮可关联多个输入类组件(输入框、步进输入、滑块、下拉选择等):

  • 关联后,各输入组件的值暂存本地,不立即写入数据源
  • 点击下发按钮时,统一收集所有关联组件的当前值,一次性批量写入
  • 适用于需要多参数同时生效的场景

待确认机制

写入设备数据点后进入待确认状态,确保数据可靠到达:


权限控制

系统通过两种权限机制控制组件的访问:

操作权限

控制输入交互组件是否允许用户操作,通过组件属性面板的"控制权限"区域配置。

  • 启用后,用户权限等级低于组件要求等级时禁止操作
  • 可选择拒绝方式:禁用(组件变灰不可点击)或 隐藏(组件不显示)
  • 适用于:输入框、步进输入、滑块、下拉选择、开关、下发按钮、编组按钮、联动按钮、键值对输入

查看权限

控制所有组件(包括输入和非输入组件)在不同权限等级下的可见性,通过组件属性面板配置。

  • 启用后,用户权限等级低于组件要求等级时,组件不渲染
  • 适用于所有组件类型

配置方式差异

组件类型操作权限查看权限
输入交互组件(输入框、步进输入、滑块、下拉选择、开关、按钮等)通过"控制权限"配置通过"查看权限"配置
非输入组件(文本、形状、图片、图表等)不支持通过"查看权限"配置

枚举类型字段在整个数据绑定流程中有特殊处理:

环节处理方式
显示匹配值自动转换为显示标签(如 0"停止"
条件判断==/!= 同时匹配匹配值、下发值和标签文本
公式计算匹配值作为数值参与运算
下发写入输入的字符串自动匹配并转换为对应的匹配值
静态选项同步绑定枚举字段的下拉选择/选项组自动同步枚举成员作为选项