如何使用关联组件？

场景说明

关联组件通常和数据标题搭配使用，所以在介绍关联组件前，请先了解一下什么是数据标题？

数据标题是表单的标识，即关键字段的组合，代表整个表单，类似于日常发送邮件前，会写上邮件的标题，让收件人对邮件内容一目了然，数据标题也起到同样的作用。

下面以员工订餐场景为例，希望员工打开问卷选择用餐时，可自动带出餐品及价格。订餐应用包括员工点餐收集、菜品信息和安全员信息三个表单，员工点餐收集表单用于给用户进行填报，菜品信息表单用于工作人员导入餐品信息，安全员信息表单用于安全员统一管辖各自员工，统一收款和采购。

导出/克隆应用时，应用中表单创建的关联关系会丢失。导出/克隆完成后，请重新创建表单间的关联关系。

操作步骤

1. 参考登录零代码工作台中操作，登录AstroZero零代码工作台。
2. 在全部应用中，单击应用后的“...”，选择“编辑”，进入编辑应用页面。
3. 在员工点餐收集表单中，拖入两个关联组件，设置热销午餐和热销晚餐。
   1. 在员工点餐收集表单中，单击员工点餐收集后的，进入表单编辑页面。
      图1 进入表单编辑页面
      
   2. 在左侧“数据组件”中，拖拽“关联组件”到画布中间。
      图2 拖拽关联组件到画布中间
      
   3. 在右侧属性面板中，设置关联组件属性。
      图3 设置关联组件属性
      
      • 显示名称：修改为“热卖午餐”。
      • 关联目标：设置为“菜品信息”中的“热卖中”。
      • 显示方式：设置为“选项列表”，并设置为“竖排”。
      • 验证：选中“必填”。
      • 字段属性：为了只让选择就餐的用户看到菜单，这里可以做一个跳题。即设置为“隐藏”，并在右侧设置例外条件，选择字段午餐就餐。
        图4 字段属性设置
        
   4. 按照上述操作，设置一个热销晚餐，如图5。
      图5 热销晚餐设置
      

4. 在菜品信息表单中，设置数据标题。
   1. 在菜品信息表单中，单击菜品信息后的，进入表单编辑页面。
   2. 单击页面右上角的“表单设置”，在数据标题中勾选要显示的字段。
      图6 设置数据标题
      
   3. 单击页面左上角的“保存”，保存设置，并返回应用开发页面。

5. 在员工点餐收集中，单击“立即订餐”，预览效果。
   图7 关联组件最终效果