# 数据绑定

[数据绑定简介](./data-binding.md)

## 数据传播

- 数据传播是基于源组件的数据值来更改目标组件的属性的配置。
- 如果源组件更改了目标组件的数据属性，则目标组件的数据传播功能会持续工作，因此称为数据传播功能。
- 可以进行多个数据传播配置。

### 复制、粘贴和删除

- 为了避免与数据传播相关的重复设置繁琐，提供了复制、粘贴和删除功能。
- 复制-粘贴：可以复制当前标签页的数据传播设置，并将其粘贴到其他组件的数据传播设置中。
- 删除：删除组件的数据传播设置中仅当前标签页的设置。

### 源数据（source）

- 当指定源组件时，它会将该组件的数据传播到目标组件（们）。
- 基于组件关系的目标指定：
  - (self)：组件本身。
- 通过 ID 指定：#id
- 如果未指定，则将该组件本身的数据传播为(self)。

### 访问器（accessor）

- 配置方法遵循[JSONATA 文档](http://docs.jsonata.org/overview.html)。

### 目标（target）

- 指定数据传播的目标组件（们）。
- 基于组件关系的目标指定：
  - (self)：组件本身。
- 通过 ID 指定：#id
- 通过类别指定：.class
- 基于数据指定的目标：
  - (key)：具有与数据对象的键值对应的 ID 的组件将成为目标组件。
  - [property]：具有与数据对象属性值的 ID 对应的组件将成为目标组件。

### 属性（property）

- 指定将应用传播数据值的目标组件的属性。
- 参考 [属性](./data-binding-property.md)

### 规则类型（rule）

指定如何将传播的数据应用于目标组件的属性。

- 值（value）
  - 值本身直接设置为目标组件的属性。
- 映射（map）
  - 使用值作为键来查找映射值，然后将其设置为目标组件的属性。
- 范围（range）
  - 将值包含在范围内的映射值设置为目标组件的属性。
- 函数（eval）
  - Eval 代码可以使用 JavaScript 语法编写。
  - Eval 代码的上下文（this）是源组件。
  - Eval 代码具有参数：value 和 targets。
    - value：具有源组件数据的访问器应用值。
    - targets：目标组件列表。

### 没有数据，就没有传播

- 仅在基于规则

### 部分传播

部分传播是在操作对象、复制或修改其属性时非常有用的概念。

例如，让我们考虑一个管理餐厅菜单项的组件。每个组件都包含以下信息的'data'对象：

```plaintext
目标组件数据（更新前）：
- 名称（name）
- 价格（price）
- 描述（description）
- 卡路里（calories）
```

我们想要更新目标组件的某些属性。以下是包含在源数据中的更新信息：

```plaintext
更新信息：
- 价格（price）
- 卡路里（calories）
```

现在，使用部分传播，我们可以仅将源数据中的某些信息应用于更新目标组件。这样，我们可以只使用源数据更改目标数据的所需属性。

结果，目标组件的数据将如下更新：

```plaintext
目标组件数据（更新后）：
- 名称（name）
- 价格（price，更新后的值）
- 描述（description）
- 卡路里（calories，更新后的值）
```