阿里低代码引擎|阿里低代码引擎 | LowCodeEngine - 如何配置并调用请求阿里低代码引擎|LowCodeEngine-如

首发于语雀文档@blueju

前言发送请求是前端中很重要也很常见的一部分，阿里低代码引擎自然也不会缺少这一块。
在阿里低代码引擎中，请求是在数据源中配置，数据源位置如下图：

阿里低代码引擎|阿里低代码引擎 | LowCodeEngine - 如何配置并调用请求

文章图片

配置配置界面如下图：

文章图片

其中数据源 ID 推荐小驼峰命名法，因为请求最终返回的结果会存入this.state.数据源ID，如上图我们表格期望展示请求结果时，就可以将this.state.数据源ID绑定到表格数据配置那里。
剩余的配置项要么配置很简单（如请求地址、请求参数、是否自动请求、请求方法），要么用得较少并不必需（如添加数据处理函数、请求头信息、超时时长），本文也不是阿里低代码引擎使用指南，故不详细阐述了。
【阿里低代码引擎|阿里低代码引擎 | LowCodeEngine - 如何配置并调用请求】
调用虽然请求配置项中有一项叫是否自动请求，但我们真实场景一般是要自行调用请求方法，比如点击查询时发送请求、点击重置时清空查询表单并发送查询请求
如何调用这一块从使用界面很难了解到，文档中也鲜有描述，不过如果有经验的话，稍微剥茧抽丝就能找到解决方。
现在需求是点击查询时需要发送查询请求，那我们在点击查询按钮后的查询中先打印一下 this 看看，如图：

文章图片

我们已经知道是在数据源中配置请求，那我们可以从打印出的 this 中查找一下关于数据源的一些关键词，如上图我们发现属性 dataSourceMap 中有一个子属性 tableDataSource，这与我们在配置中的数据源 id 一致，并且它下面还有一个 load 方法，猜测它是调用方法，那我们在查询按钮所触发的查询方法中写上调用代码。

search() { console.log(this) const response = this.dataSourceMap.tableDataSource.load() response.then(res => { console.log(res) this.setState({ tableDataSource: res }) }) }

如下图，我们如期望的手动调用了请求，并成功地返回了响应结果。