Skip to content

可执行函数

可执行函数是低代码平台中用于扩展业务逻辑的重要能力。你可以在组件事件、自定义动作等场景中编写浏览器原生支持的 JavaScript 代码,通过平台注入的内置变量与页面、数据、UI 等进行交互。

视频教程

TBD

可执行函数上下文(内置变量)

以下变量在可执行函数执行上下文中自动可用,无需手动引入。

变量名类型返回值说明说明
$requestFunctionPromise<数据>发起 HTTP 请求。支持两种调用方式:
1. $request({ method, url, data, params, ...options })(直接 axios 配置)
2. $request(define, options)(基于数据定义发起请求)
$downloadFunctiondownload 工具对象获取下载工具实例,用于触发文件下载等操作
$messageFunctionmessage 工具对象获取消息提示工具
$emitFunctionvoid发布页面维度的自定义事件:$emit(key, ...args)
$closeFunctionPromise<结果>触发当前页面/弹窗关闭,并可传递结果
$dialogFunctionPromise<结果>(弹窗关闭时 resolve 的值)打开一个配置化弹窗,关闭时返回结果:
$dialog({ title, width, fileId, version, params })
$useExposeContextFunctionPromise<上下文>(组件上下文对象)获取指定组件暴露的上下文(默认为当前组件):
$useExposeContext(_vid|_var)
$dataFunctionPromise<数据>(获取时返回数据;设置时返回更新后的数据)获取或设置数据变量的值:
$data(_var|参数, 数据?)
$submitFunctionPromise<结果>(提交操作的响应结果)触发数据提交(通常用于表单):
$submit(_var|参数)
$logFunctionvoid打印日志到控制台并显示消息提示:
$log(...args)
$argsArray当前函数接收到的参数数组,例如第一个参数为 $args[0]
return-使用 return Promise.resolve(结果) 返回执行结果(推荐返回 Promise)

使用示例

打开弹窗并在关闭后刷新当前组件

该示例展示如何使用 $dialog 打开一个“创建目录”弹窗,并在其关闭后刷新当前组件的数据。

js
return $dialog({
  title: '创建目录',
  fileId: 5,
  params: {
    parentId: 0
  }
}).then(async () => {
  (await $useExposeContext()).refresh()
})

获取组件上下文并根据数据状态执行不同操作

从 ID 为 'form' 的组件中获取上下文,读取表单数据,根据是否存在 id 字段决定调用哪个数据操作。

js
return $useExposeContext('form').then(async (ctx) => {
  const data = await ctx.getData()
  if (data.id) {
    return await $data('updateDir')
  } else {
    return await $data('createDir')
  }
})

记录调试信息

使用 $log 同时输出到控制台和 UI 消息提示,便于调试。

js
$log('当前参数:', $args[0], '时间戳:', Date.now())

注意事项

  • 可执行函数同时支持同步与异步写法,由开发者自行决定。但强烈推荐使用异步(async/await 或返回 Promise,以避免阻塞主线程导致界面卡顿。
  • 所有异步内置函数(如 $data$useExposeContext$request$dialog 等)均返回 Promise,请务必使用 await.then() 正确处理。
  • $args 是平台自动注入的参数数组,对应函数调用时传入的实际参数(如事件对象、自定义参数等)。
  • 不要尝试修改内置变量(如 $request = null),这会导致运行时错误。
  • 若需防抖或节流,请在函数配置中启用相应选项(如 debounce: true),而非在代码中自行实现。