跳到主要内容
版本：Next

组件参数-组合模板

1.概述​

页面中部分组件相同，唯独绑定的数据不同，期望可复用相同的部分。此时可将需要复用的部分组合起来，配置组合的组件参数，与之对应的组件所显示信息自动更新。例如：一个设备模板组合可通过参数传递设备号与ID，以显示对应设备实例的信息；

2.功能介绍​

此处以 “组合模板” 作为示例进行说明，当需要检测多个设备温度与电压时，期望仅需配置组合模板的组件参数，与之对应的组件所显示信息便能自动更新，无需逐个针对组件的索引变量进行修改，大幅提升检测流程的效率。

image-20241219104703889

2.1构建参数化组合组合（创建组合模板）​

第一步：组合组件​

将需要复用的组件封装为一个组合

  • 操作：选中需要复用的组件ctrl+G快捷键封装组件

    • image-20241219140701447

第二步：定义组合组件参数​

将动态部分定义为组合的组件参数，如“序号”，"ID"；

  • 操作：选中组合，在右侧属性栏-组件参数处，点击[添加]按钮，输入组件参数名称；
  • image-20241219151918913

第三步：绑定组件参数​

组合元素动态化，由"固定格式"拼接"组件参数"实现动态效果，如[监测点温度]动态绑定变量为$vars["MX"+$this.parent.params.序号+"T__1Dis"]

  • 操作：

    a）文本类组件：文本内容动态显示，如设备号（静态文本），您可通过表达式动态生成文本内容，如"设备"+$this.parent.params.序号]

    image-20241219135608572

    b）读写组件：变量动态关联，如监测点温度（设备1的监测点温度为MX1T__1Dis，设备2为MX2T__1Dis，以此类推），您可通过表达式动态绑定变量，

    使用**$vars[变量名]**声明变量，表示绑定该变量的值，其中变量名通过'静态字符'+$参数拼接

    $vars[
    "MX"+$this.parent.params.序号+"T__1Dis"
    ]

    image-20241219140219472

    注：

    i. 字符串需使用英文单引号或双引号，如"str" 'str'

    ii.实际使用过程中表达式非硬性分行，本处分行只是便于观察结构，$vars["MX"+$this.parent.params.序号+"T__1Dis"]同样适用

2.2复用组合（应用组合模板）​

复用组合能够在多种复杂的应用场景下实现无缝衔接与高效整合，从而大大提高配置效率。复用组合分为在同一工程与不同工程两个场景；

  • 同一工程

    直接复制粘贴组合，仅需修改组合的组件参数，与之对应的组件所显示信息便能自动更新。

    image-20241219101445896

  • 不同工程

    若在其他工程里存在对该组合的复用需求时，可把组合转化为资源。随后，在相应的其他工程中直接导入此资源，无需重复配置工作，极大地提高了工程构建效率。

    image-20241219101355791

    image-20241219102536143