跳到主要内容

数据绑定

本文介绍常用组件的数据来源绑定方式。

1. 接口绑定

  • API

    通过该选项可以选择已经设计好的逻辑文件,所获取的数据来自自定义的逻辑。

    接口绑定 - API

  • 外部 API

    可自定义配置外部 API 的地址、参数、返回类型等。

    接口绑定 - 外部 API

    也可以通过导入数据文件的方式生成 API,例如 Swagger 生成的 json 文件。

    外部 API 文件导入

  • 静态数据源

    静态数据源即固定的静态数据,格式为 JSON,可自定义。注意:JSON 文件格式必须正确,否则可能导致无法解析。

    接口绑定 - 静态数据源

2. 数据绑定

数据绑定可用于子组件访问父组件的数据来源。例如卡片组件绑定了数据源,内部的文本组件即可绑定卡片数据集中的字段。

数据绑定示例 1

数据绑定示例 2

3. 组件绑定

用于绑定其他组件所提供的数据。

组件绑定

4. 模型绑定

模型绑定可在不绑定 API 的前提下,快速生成表单项。每一个表单项都会绑定模型中的一个字段。

5. 动作回调数据

动作回调数据的绑定方式较为特殊,目前仅支持在事件配置中使用,且需要配合接口请求,才会生成可用的回调数据用于赋值。

动作回调数据绑定

6. 视图参数

视图参数是在页面跳转时传入的参数,打开页面后其值通常不变。可在大纲树的视图节点下设计视图参数。

视图参数设计

如上图所示,设计了视图参数 param1,类型为 string,此参数可以绑定到文本组件或其他支持视图参数的组件中。

可见 param1 的绑定选项:

视图参数绑定示例

7. 手动赋值

手动赋值适用于不需动态变化的静态内容,例如页面标题,可直接输入固定文本。

手动赋值示例