创建 UI 逻辑

通过添加 UI 逻辑，将您的线框图转化为交互式原型，使组件能够执行操作或响应来自后端系统的模拟数据，从而模拟复杂的用户体验。

连接组件

在 UI 组件之间建立连接，使其能够相互通信。例如，鼠标点击时按钮的外观应如何变化，以及 UI 应如何响应鼠标点击时发出的信号来执行相应操作。

使用属性别名和状态

您可以通过绑定 UI 组件的属性来建立连接。这样，当父组件中的某个属性值发生变化时，它会发出一个指示值变化的信号，从而自动更新所有子组件中的该属性值。

若要从一个组件引用另一个组件的属性，可以创建属性别名，该别名将保存对另一个属性的引用。 与普通属性定义（会为属性分配一个新的、唯一的存储空间）不同，属性别名将新声明的属性（称为“别名属性”）作为对现有属性（“被别名属性”）的直接引用进行连接。 任何数据驱动的内容都应作为相关组件的公共属性导出。例如，速度表应具有一个速度属性，UI 与该属性绑定。

您可以声明各种UI 状态，用于描述属性值相对于基础状态的变化情况。状态是组织 UI 逻辑的一种有效方式。您可以将过渡效果与组件关联，以定义当状态变化导致属性发生改变时，这些属性的动画效果。

通过使用属性别名和状态来创建组件实例之间的差异，使您能够复用组件而非重复创建。因此，这些组件无需被视为完全新的组件类型进行处理。这既缩短了加载和编译时间，也减小了最终应用程序的包大小。

自定义 UI 控件

预设的UI 控件具有默认属性和状态，您可以对其进行修改。如果您需要额外的属性，可以将控件实例转换为自定义组件，并为其指定新属性。

编写表达式

为了让您的 UI 执行特定操作，您可能需要编写 JavaScript 表达式来设置条件或将数字转换为字符串。例如，您可以使用布尔逻辑的 AND、NOT 和 OR 运算符绑定属性值，以及映射数字和数值范围。此外，您还可以双向同步两个组件的属性值。

典型用例

下表总结了一些典型用例，并提供了更多信息的链接。