
# 级联选择
级联选择组件用于实现下拉级联菜单。
在表单设计页面，从"常用组件"中，拖拽"级联选择"组件至表单设计区域，如[图1]所示。
图1拖拽级联选择组件到设计区并设置属性   
![](https://support.huaweicloud.com/usermanual-astroflow/zh-cn_image_0000001949960810.png)
- 标题：该字段在表单页面呈现给用户的名称。
- 帮助提示：为字段添加帮助信息。设置后，标题字段后会显示![](https://support.huaweicloud.com/usermanual-astroflow/zh-cn_image_0000001712504741.png)。
- 描述信息：为字段添加附加的说明信息。
- 状态：设置字段的状态，如普通、禁用、只读和隐藏。
  - 普通：设置为普通后，页面上该字段可正常显示，且可进行配置。
  
  - 只读：设置为只读后，页面上该字段只可读。
  
  - 禁用：设置为禁用后，页面上该字段仍可显示，但不可进行配置。
  
  - 隐藏：设置为隐藏后，页面上会隐藏该字段。
   
- 选项 \> 编辑层级：设置下拉级联菜单的层级，支持编辑树形结构和编辑代码两种方式。 例如，新增"选项2\>选项2-2\>选项2-2-2"级联菜单，具体步骤如下：
  - 编辑目录树结构
    1. 在级联菜单属性设置页面，单击"编辑层级"。
    
    2. 在编辑选项层级页面，单击"新增节点"，新增名称为"选项2"的节点。
       图2新增选项2菜单   
       ![](https://support.huaweicloud.com/usermanual-astroflow/zh-cn_image_0000001734306197.png) 
    
    3. 将鼠标放在新增的"选项2"节点上，单击![](https://support.huaweicloud.com/usermanual-astroflow/zh-cn_image_0000001734186357.png)图标，新增子选项2-2。
       图3新增选项2-2   
       ![](https://support.huaweicloud.com/usermanual-astroflow/zh-cn_image_0000001686147436.png) 
    
    4. 同样，将鼠标放在"选项2-2"上，新增子选项2-2-2，完成后单击"确定"。
       图4新增子选项2-2-2   
       ![](https://support.huaweicloud.com/usermanual-astroflow/zh-cn_image_0000001801501041.png) 
    
    5. 在表单设计页面，单击"保存并预览"，即可预览效果。
       图5新增级联层级最终显示效果（编辑目录树结构）   
       ![](https://support.huaweicloud.com/usermanual-astroflow/zh-cn_image_0000001734306201.png) 
     
  
  - 编辑代码
    1. 在级联菜单属性设置页面，单击"编辑层级"。
    
    2. 在编辑代码页签，输入如下代码，单击"确定"。
       ```
       [
           {
               "label": "选项1",
               "value": "1",
               "children": [
                   {
                       "label": "选项1-1",
                       "value": "1-1",
                       "children": [
                           {
                               "label": "选项1-1-1",
                               "value": "1-1-1"
                           }
                       ]
                   }
               ]
           },
           {
               "label": "选项3",
               "value": "选项3",
               "children": [
                   {
                       "label": "选项3-3",
                       "value": "选项3-3",
                       "children": [
                           {
                               "label": "选项3-3-3",
                               "value": "选项3-3-3"
                           }
                       ]
                   }
               ]
           }
       ]
       ```
       
    
    3. 在表单设计页面，单击"保存并预览"，即可预览效果。
       图6新增级联层级最终显示效果（编辑代码）   
       ![](https://support.huaweicloud.com/usermanual-astroflow/zh-cn_image_0000001686306632.png) 
     
   
- 是否必填：字段是否必填。设置为必填时，字段前会带"\*"。
- 占位符：设置字段的占位符。
- 默认值：设置该字段的默认值。
- 允许清空：下拉级联菜单是否允许为空。启用和禁用后，显示效果如[图7]所示。
  图7设置效果   
  ![](https://support.huaweicloud.com/usermanual-astroflow/zh-cn_image_0000001734166973.png) 
 
