功能概述
你可以使用数据请求从大多数数据源中读取和写入数据,目前飞书低代码平台支持了多数主流的数据库(如 MySQL、MongoDB)和 APIs。
你可以从「代码 - 数据请求」找到相关功能:
250px|700px|reset
创建一个数据请求
创建步骤大致可以分为:
- 选择数据源(重要):可以是平台默认提供的「飞书低代码平台对象」,也可以是私有的 MySQL 数据库
- 执行操作:选择数据源下的一个 API 方法/接口,例如「查询多行记录」用于数据表格展示
- 触发方式(可选):可以简单理解为「自动」和「手动」两种模式,下文详细介绍
- 数据转换(可选):可以对返回的数据结果进行二次加工,如简单的过滤、拼装等
- 响应事件(可选):可以在数据请求成功、失败时定义一些交互动作,比如弹出 Toast 提示
250px|700px|reset
将数据请求连接到组件
你可以使用{ {query.data} }将数据请求的查询结果连接到组件。例如,你创建了一个名为「getOpportunity」的数据请求来查询商机数据,并打算使用数据表格组件来展示查询结果,那你可以使用以下两种方式:
- 将数据表格的「数据」属性选择为目标数据请求
250px|700px|reset
- 使用 JS 表达式将表格的「数据」属性设置为{ {getOpportunity.data.items} } - 图二
250px|700px|reset
自动运行数据请求
只读类型的数据请求(例如,查询对象的多行记录)可以设置为在页面加载时自动运行,同时,在其引用的参数/变量更改时,也会自动运行;
例如,下图中每次{ {textInput.value} }更新时都会自动触发,即用户输入搜索框内容的时候都会触发数据请求重新查询数据。
250px|700px|reset
手动(事件触发)运行数据请求
增删改类型的数据请求(例如,更新对象的某行记录)可以设置为手动运行。例如,通过一个表单更新商机表的数据,当你打开页面时数据请求并不会自动运行,而是你操作一个表单点击提交按钮时,来触发这个数据请求允许,已避免飞书低代码平台意外写入错误的数据。
不论是自动、手动都是可以由你手动设置、调整的,见下图:
250px|700px|reset
如何向数据请求内传参
方式一:显式定义参数,并在调用时传入参数
点击「入参配置」,唤起浮窗后可以添加多个参数名,定义后
- 在数据请求中输入{ {params.} }系统会自动给出可用参数提示
- 在调用数据请求时,会支持按照设置的参数进行传参
数据请求的参数类型均为 any,且不要求必填
250px|700px|reset
方式二:隐式定义参数,并在调用时传入参数
- 在数据请求的 JS 表达式输入框中输入 「params」+「任意自定义变量名」,如{ {params.sampleVar} }
- 调用数据请求时会出现「sampleVar」入参,如事件动作中即可为入参变量赋值
250px|700px|reset
使用数据转化(Data Transformer)
使用数据转化对数据请求查询结果进行加工,比如格式美化、数据过滤、排序、运算等,以便更好的在页面上使用。
例如,我们查询一个商机表的数据并对结果进行二次筛选,仅保留「商机等级为s」的数据。
return data.items.filter(item => item.level === 's'))
250px|700px|reset
使用数据请求响应事件
使用响应事件添加数据请求允许成功、失败后的交互动作。
以下场景均可使用响应事件来实现:
- 成功、失败后的气泡提示
- 更新记录成功后刷新页面数据
- 新建记录成功后跳转目标记录详情页
例如:在数据请求允许成功后弹出一个气泡提示【成功】,如下图。
250px|700px|reset