# 设置UI引擎前端页面气泡卡片组件属性
气泡卡片组件是一种用于展示提示信息或附加内容的交互组件，广泛应用于工具提示、快速操作指引以及数据补充显示等功能。该组件支持多种触发方式与位置自定义，能在不占用主页面空间的前提下，提升界面的信息承载能力与交互友好性。
#### 前提条件
已在当前页面添加"气泡卡片"组件，具体操作请参见[为UI引擎前端页面添加物料组件](https://support.huaweicloud.com/usermanual-idme/idme_ui_0016.html)。
#### 配置入口
1. 在页面设计器的中心画布区，单击选中"气泡卡片"组件。
2. 在右侧设置面板中，单击![](https://support.huaweicloud.com/usermanual-idme/figure/zh-cn_image_0000002503567314.png)，即可展开"属性"设置面板。
 
#### 基础信息
| 属性名称  | 说明                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               | 是否支持变量绑定 |
|:---|:---|:---|
| 状态绑定值 | 用于手动控制弹出层的显示/隐藏状态，仅当"触发方式"设置为"手动"时有效。可结合设备状态、参数阈值等条件动态切换，例如设备报警时自动显示气泡卡片提示故障信息。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | 是        |
| 触发方式  | 定义弹出层的触发规则，支持三种模式，适配不同需求： - 点击：鼠标单击触发源（如按钮、图标、文本）时显示弹出层，适用于需要主动查看详细信息的场景（如单击设备编号查看参数详情）。  - 鼠标悬浮：鼠标移入并悬浮在触发源上时显示，移出后隐藏，适用于被动提示场景（如悬浮工艺指标名称查看指标说明）。  - 手动：仅通过"状态绑定值"控制显示/隐藏，适用于需根据业务逻辑自动触发的场景（如设备异常时自动弹出报警提示）。   | 是        |
| 弹出层位置 | 设置弹出层相对于触发源的展示位置（如上边、上右、右上、右边、右下、下左、下边），可根据页面布局调整，避免弹出层遮挡关键控制元素（如按钮、数据仪表盘）。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      | 是        |
| 是否禁用  | 控制是否禁用整个气泡卡片的弹出功能，禁用后无论何种触发条件，弹出层均不显示。适用于特定状态（如设备停机、页面锁定）无需提示的场景。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | 是        |
| 显示箭头  | 控制是否显示弹出层与触发源之间的连接箭头，箭头可明确指向触发源，提升提示关联性，建议默认开启，避免多元素页面中提示来源混淆。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | 是        |
| 弹出层标题 | 设置弹出层的头部标题文本，建议简洁明确（如"设备故障提示"），便于快速识别提示类型。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | 是        |
| 弹出层内容 | 设置弹出层的核心内容文本，可填写设备参数、故障原因、操作步骤等专属信息，支持结合变量绑定动态展示实时数据（如当前温度、压力值）。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 | 是        |
   
#### 其他
如下属性适用于UI引擎所有组件，用于精细化控制。
| 属性名称   | 说明                                                                                                                                 | 是否支持变量绑定 |
|:---|:---|:---|
| 元素id值  | 对应HTML标签的"id"属性，同一页面内必须唯一。                                                                                                         | 是        |
| 样式类    | 对应HTML标签的"class"属性，为空格分隔的类名列表，用于自定义组件样式。默认为"component-base-style"。                                                                 | 是        |
| ref引用类 | 对应Vue的"ref"属性，用于注册模板引用以访问组件实例方法。 如果为"数据源表单"组件，会自动填充默认值。 | 是        |
   
#### 插槽信息
| 插槽名称 | 说明                                                                                                                                                                                                                                                                                                                                                                                                                                                                        |
|:---|:---|
| 触发源  | 默认开启的基础插槽，用于自定义弹出层的触发元素。可插入按钮、图标、设备编号文本、参数数值等元素，替代默认触发源，提升与页面布局的融合度。                                                                                                                                                                                                                                                                                                                                                                                                      |
| 内容插槽 | 用于自定义弹出层的完整内容，支持插入表单、表格、图片等复杂元素（如故障排查流程图、参数配置表）。 配置此插槽需满足两个条件： - 将"触发方式"设置为"手动"。  - 将"状态绑定值"设置为"true"，确保弹出层持续显示以承载自定义内容。   |