数据详情
#
适用场景适用于从数据源中查询一条数据,并将返回数据展示的场景,如查询访客预约详情。
#
基本功能1 查询某条数据
数据详情组件是获取数据的核心组件之一,可快速从数据模型、APIs 中查询一条数据,并渲染到页面上。
2 数据使用和展示
数据详情是一个数据提供器,所提供的数据,可供所有业务组件使用。具体用法如下:
将需要绑定数据的组件拖入数据容器内,点击「绑定字段」,即可选择数据容器的数据。

#
属性介绍组件接收的外部传入的属性
属性名 | 属性标识 | 类型 | 属性分组 | 默认值 | 说明 |
---|
数据源 | dataSourceType | {"label":"数据模型","value":"data-model"}|{"label":"APIs","value":"custom-connector"} | 基础属性 | "data-model" | 数据源类型选择 |
数据模型 | datasource | object | 基础属性 | - | 展示模型数据的数据来源 |
APIs | bindConnectMetadata | object | 基础属性 | - | 展示数据的APIs来源选择 |
调用方法 | connectorMethod | object | 基础属性 | - | 展示数据的APIs调用方法选择 |
查询入参 | connectorParams | string | 基础属性 | - | 对APIs调用方法获取的数据进行筛选过滤。支持对象类型,例如 {name:'',value:''} |
数据筛选 | where | array | 基础属性 | - | 对数据进行筛选过滤 |
#
事件介绍组件暴露的事件,可以监听组件的事件来触发一些外部的动作
事件名 | 事件code | 事件出参 event.detail | 适用情况 | 说明 |
---|
查询为空 | queryEmpty | 兼容三端 | 数据查询为空时触发 | |
查询成功 | querySuccess | 兼容三端 | 数据查询成功时触发 | |
查询失败 | queryFail | 兼容三端 | 数据查询失败时触发 |
#
应用示例以下示例展示模型访客详情:
1. 添加一个数据详情组件数据源支持数据模型和 APIs。查询条件按需设置。如
设置查询筛选条件,数据标识为从其他页面跳转传入的页面 URL 参数 id。

如此,查询访客预约详情就完成了! 绑定数据过程如下: