UIOTOS文档: 工具函数 | 页面嵌套 零代码 低代码 0代码 无代码 iframe 数据大屏 web组态 前端框架 | 致敬amis codewave 乐吾乐 goview dataRoom等

**

`注意:本文为自动抓取供AI学习!!格式未经调整,点击查看原文档

**

特别说明:这里指组件,可开箱即用,并非代码函数。本手册不要求用户要了解代码编程。

UIOTOS中一切都是组件。函数属于其中的功能类组件,有输入输出执行属性作为最基础的特性,理论上可以组成最小的逻辑单元,与芯片和逻辑电路中的三极管等类似:

通过最简单的透明传递(transfer)搭配组合,也能实现一些通用的基础逻辑模块,类比有助于帮助理解本工具逻辑实现原理,以及能实现的程度。
以“类三极管”的灵活性(原子性),结合内置常用函数选项,可构建出复杂的业务逻辑。并且会出现如下情况:

相同逻辑,内置某个函数选项就能实现,也能通过透明传递、数学计算等若个基础组件组合实现。后者是基于现有功能,前者是对特定功能升级后的内置。两种方式可并存。

函数组件在使用时,编辑状态下可见,运行时不可见,通常与界面类组件配合,如下所示:
20240729153815_rec_.gif
与通常理解的概念一样,函数组件也是一个黑盒,内部对应每个函数特定的功能(比如数学计算格式转换等),主要特性如下:

  • 编辑时有界面(可拖拽配置),运行时不可见。
  • 第三方函数库,可封装来用,避免重复造轮子(界面相关的UI库,可封装成UI组件)。
  • 输入对应传参,输出对应返回,执行对应调用。
  • 输入执行等都可以连线操作,输出能对外连线传出。
  • 输出可以作为另一个输入,相当于连续调用。

函数组件的意义在于,能够实现连线嵌套无法做到的逻辑计算和数据处理功能。如下所示:
示例:未用工具函数时,仅能实现有限的界面逻辑如下所示:

  • 对话框弹窗嵌套功能,继承文本框后,能显示内容并弹窗。
  • 表格支持行列数据加载和相关事件。
  • 通过连线和赋值解析,可提取当前行数据,在操作按钮点击时,输出弹窗显示。

20240729172733_rec_.gif
这里有用到嵌套、继承、连线、解析、事件关联和代理。如果要指定某个操作按钮(比如查看),触发弹窗(而不是任一按钮都触发),不用工具函数,就无法实现了。原因如下:

  • 树表格的事件无法区分操作按钮,仅在行数据中有当前点击按钮标识。
  • 连线赋值解析,能提取当前行数据的点击按钮,但无法提供条件判断。

示例:工具函数联合使用,可实现复杂的交互或业务逻辑> 工具函数 + UI组件 + 连线,可用形成工作流、规则链。

  • 实现扇叶转动,并且点击可切换启停

20240730012127_rec_.gif

  • 实现0~100自增再自减,循环往复

20240730012512_rec_.gif

  • 数值大小比较器

20240730011848_rec_.gif
本篇主要列出不同函数组件各自独有的属性,公共属性参见[函数组件]

常用

透明传递(transfer

说明

不带任何函数功能,执行时默认将输入直接输出。主要是利用当前组件作为函数和常规组件,都具备的通用功能,比如赋值解析输出合并延时执行等特性。

属性

略。
参见公共-函数属性

代码块(高级)(codeBlock)

说明

函数输入和输出之间,交由自定义代码实现逻辑。当内置函数选项暂不满足要求,用现有的连线去搭建逻辑繁琐时,可以使用本函数,实现临时扩展一个函数组件。

优点:封装性足够,对外部而言,嵌套、连线,跟使用常规组件或函数,没有任何区别。
缺点:临时扩展封装,无法自定义扩展属性,无法追加到属性面板中用于编辑、连线等。

属性

自定义代码 ☆(_function

函数类型``可读写

自定义工具函数功能代码。

完全自定义函数实现。透明传递的实现是空,输入(组)(inputs)是什么,直接给到输出(output)。而本属性是提供函数开放给到用户,支持自定义JavaScript代码。函数传入为输入,返回就给到输出,原型如下:

/*
[入参]:
1) data:组件图元对象(可忽略,一般用不上)
2) gv:页面场景对象(可忽略,一般用不上)
3) cache: 缓存对象,多次可以任意增加用户数据字段,函数重入时会传入。
4) inputs:输入(组)当前值。
[返回]: 给到输出(output)。
*/
function(data,gv,cache,inputs){
   
  /*---------------------

  TODO   
  
  ---------------------*/
  return inputs;
}

更多参见公共-函数属性

随机数(random

说明

支持输出随机数字、颜色、字符串(包括UUID唯一标识)。输入(组)(inputs)可以设定范围或者数组,范围内随机数字,或者数组中随机挑选颜色或字符串输出。通常与定时器结合,能够输出模拟数据。如下所示:
20240801112041_rec_.gif

属性

随机类型 ☆(_valueType

枚举类型``可读写

选择数字、颜色等生成的随机数类型。

包括正数数字颜色字符串。其中:

  • 选择**正数**

输入(组)(inputs)为数字类型,用于配置随机数的上限,随机数将在0到配置值之间,默认为100

  • 选择**数字**

输入(组)(inputs)为数字数组。索引0:随机数下限;索引1:随机数上限,默认为[-100,100]

  • 选择**颜色**

如果输入(组)(inputs)配置了非空数组(多个颜色的字符串数组),将随机选择输出。如下所示:

[
  "#1f1f1f",
  "#00b96b",
  "#f2534b"
]

如果没有配置,或者不是非空数组,将随机输出任意颜色。

  • 选择**字符串**

如果输入(组)(inputs)配置了非空数组(多个任意字符串数组),将随机选择输出。如下所示:

[
  "hello",
  "uiotos",
  "welcome"
]

如果没有配置,或者不是非空数组,将输入32位随机不重复的UUID,如下所示:

"2c370d43-9a38-47f4-a68d-9ad83ff2b55b"

注意:需保持通用属性输入赋值时执行 (exeWhenInput)默认不勾选,避免将输入(组)(inputs)配置当作常规输入,初始加载时触发函数执行。否则随机数被嵌套后,上层继承输入设置范围,运行时不起作用。


更多参见公共-函数属性

信息提示(messageAlert

说明

通过输入(组)(inputs)属性设置信息文字内容,函数执行时,按照提示类型弹出相应的提示,如下所示:
20240801112633_rec_.gif

属性

提示类型 ☆(_type

枚举类型``可读写

选择提示的类型,包括错误、警告等。

类型和效果罗列如下:

  • 警告

QQ_1722480483591.png

  • 错误

QQ_1722480505148.png

  • 成功

QQ_1722480523131.png

  • 提示

QQ_1722480541150.png

  • 自定义

QQ_1722480558852.png

  • 弹窗确认

QQ_1722480928550.png

标题文字 ☆(_title

字符串类型``可读写

显示的标题文字。

显示位置 ☆(_region

枚举类型``可读写

信息显示在屏幕的相对位置。

持续时间 ☆(_duration

数字类型``可读写

信息停留的时长,0为不自动消失。

固定宽度 ☆(_fixedWidth

数字类型``可读写

提示区域宽度(提示条或对话框)。

固定高度 ☆(_fixedHeight

数字类型``可读写

固定高度(注意:仅对弹窗确认选项有效)。


更多参见公共-函数属性

数学逻辑计算

值是否相等(isEqual

说明

输入(组)(inputs)的值和目标值 ☆(_target)作比较,可选择判断相等或不相等,以及是否严格比较,并且可以指定判断成功或失败时分别输出值(默认为truefalse)。如下所示:
20240802004021_rec_.gif

属性

选择判断 ☆(_equalTo

枚举类型``可读写

选择判断输入(组)目标值“相等”还是“不相等”。

严格程度 ☆(_strict

枚举类型``可读写

比较包括数值和类型,可选择不同的严格程度。

匹配的严格程度分为以下三级:

  1. 最宽松(**lowest**

仅判断内容,不考虑类型、空置等细微差别,都认作相等:

  • 各种空值([]{}nullundefined,以及0false)之间。
  • 1true
  • 字符串,收尾空格、大小写差异忽略。(如" hello uiotos ""Hello UIOTOS"认为相等)

示例如下,输入(组)目标值都是下面对象时,判断为相等:

{
   
    "name": "uiotos",
    "version": 3.0
}
  1. 一般(**middle**

开始区分类型,各种空值([]{}nullundefined0false)之间(以及1true),不再判断为相等。不过对象与对象之间,还是只判断值是否相等,不判断引用是否相同(二次开发用户才需关心)。

  1. 最严格(**highest****) **

主要是对象(和数组)的情况,即便值相等,也可能不相同(引用),通常也都判断为不相等。非二次开发用户,慎重勾选这里,常规使用到一般即可!

比如空对象{}之间,也是不等的。需要值引用相同才相等。1中的示例两个对象,在严格模式为不相等。如下所示:

20240801164815_rec_.gif

目标值 ☆(_target

对象类型``可读写

用于与输入(组)按照选择判断 ☆(_equalTo)来比较的数据。

错误时输出 ☆(_falseReturn

对象类型``可读写

上面判断 ☆(_equalTo)结果错误时输出的值,默认输出false

正确时输出 ☆(_trueReturn

对象类型``可读写

上面判断 ☆(_equalTo)结果正确时输出的值,默认输出true


更多参见公共-函数属性

基本数学计算(calculation

说明

提供常见的数值计算和处理功能。具体包括:、取小数位数乘方转弧度正弦余弦正切余切
默认以输入(组)作为被操作数(被除数、被乘数等),另一个数为操作数 ☆(_value),并且可以通过反操作 ☆(_reverse)来互换操作位置。如下所示:
20240801191104_rec_.gif

属性

选择公式 ☆(_method

枚举类型``可读写

公式列表选择。

注意,按不同公式的要求,会动态显示或隐藏操作数 ☆(_value)属性。如下所示:

  • **加上(+)**
  • **减去(-**

此时操作数 ☆(_value)默认为减数

  • **乘以(×)**

此时操作数 ☆(_value)默认为乘数

  • **除以(÷)**

此时操作数 ☆(_value)默认为除数

  • **小数位数**

此时操作数 ☆(_value)默认为要取输入(组)小数位数

  • **乘方(a^b)**

此时操作数 ☆(_value)默认乘方数(即a^b中的b)。

  • **转弧度(∠)**

输入(组)作为角度值,转换成弧度值。无操作数 ☆(_value)属性。

  • **正弦(sin)**

输入(组)正弦值。无操作数 ☆(_value)属性。(勾选反操作 ☆(_reverse)取反正弦)

  • **余弦(cos)**

输入(组)余弦值。

  • **正切(tan)**

输入(组)正切值。

  • **余切(cot)**

输入(组)正切值。

操作数 ☆(**_value**

**数字类型**``**可读写**

与输入(组)作为被操作数对应的操作数。

参与运算的另一个值。

比如输入(组)A选择公式 ☆(_method)减法(-),这里操作数 ☆(_value)B,那么表达式就是A - B。注意,反操作 ☆(_reverse)勾选后,A``B位置互换,表达式变为:B-A

反操作 ☆(**_reverse**

**布尔类型**``**可读写**

操作反转,参与运算的两个数输入(组)另一个数 ☆(_value)方向互换,或者一个参数的,用反函数。

注意事项:


更多参见公共-函数属性

条件逻辑判断(condition

说明

输入(组)传入多个条件,分别为true)或false),整体按照判断逻辑 ☆(_logical)选择后,新的条件成立还是不成立。注意:

如下所示:
20240802051911_rec_.gif

属性

判断逻辑 ☆(_logical

枚举类型``可读写

输入(组)数组各项参会当前逻辑判断。

要求输入(组)数组各项分别判断truefalse,结果分布在以下情况,分别说明如下:

分项判断原则(非布尔值的强制转换):

  • 大于0的整数相当于true。
  • 小于等于0的整数为false(此外,undefined未定义也为false)。
  • 非空字符串、数组、对象为true。
  • 空字符串、空数组、空对象等分别判断true还是false,取决于空值判断 ☆(_emptyJudge)
  • 全部满足

各项全部都是true

  • 至少一个不满足

属于上面全部满足的反逻辑。

  • 全部不满足

各项想不都是false

  • 至少一个满足

属于上面全部不满足的反逻辑。

以上4个选项,分为两组,以全部满足全部不满足为代表。各自组内有对应反项,比如至少一个不满足,就是除了全部满足之外的所有情况。至少一个满足也类似。

空值为否 ☆(_emptyJudge

字符串类型(枚举多勾选)``可读写

列出所有空类型的数据,勾选的判断为false,没勾选的判断为true。

  • 所有空值

所有下面的空值,都判断为false

  • 空字符**""****包含时,判断为false;不包含时,判断为true
  • 无对象**null**

(同上)

  • 空对象**{}**

(同上)

  • 空数组**[]**

(同上)

该属性通常用在数据解析场景,用于精准判断特殊空值的类型。

自定义输出 ☆(_content

对象类型``可读写

任意用户数据,当条件满足,且有勾选启用自定义 ☆(_returnContent)时输出。

默认情况下,当判断逻辑通过,返回true。当前属性提供了一种便利,允许条件通过时,直接将当前属性值作为指定的业务数据输出,当然,若填入true,就跟默认输出一样了。条件不满足时,固定输出false

启用自定义 ☆(_returnContent

布尔类型``可读写

勾选后,条件满足,将输出自定义输出 ☆(_content)属性内容,而不是默认的true。


更多参见公共-函数属性

数组和组件操作

数组与字符串互转(arrToString

说明

用于实现将输入(组)的字符串转数组,或者数组转字符串。比如:
字符串:"hello,uiotos,welcome,!"
以逗号","作为间隔符号时,转换得到:
数组: ["hello", "uiotos", "welcome", "!"]
反之亦然,双向转换。按照输入(组)数值类型,自动识别转换方向。如下所示:
20240802063834_rec_.gif

属性

间隔符号 ☆(_flag

字符串类型``可读写

转换识别的字符串间隔标识符。

字符串数组时,以间隔符号划分成多个子字符串。数组字符串时,数组各段内容分别转成字符串,然后用间隔符号拼接起来(支持空字符串"",此时转成的字符串,数组各段直接收尾衔接)。

注意:本属性为字符串类型,设置值时直接输入即可,不需也不可带引号""(否则引号也会被当成字符内容)。如果要设置空字符串"",回退清理默认的",",然后保存即可!

更多参见公共-函数属性

获取数组元素索引(arrIndex

说明

用于对已有任意数组,输入(组)传入指定元素值,查找在数组中的索引。比如存在目标数组 ☆(_rawArray)

 ["hello", "uiotos", "welcome", "!"]

输入(组)中传入元素"uiotos",函数执行后返回1,即在数组中的索引值(从0开始)。如下所示:
20240803190119_rec_.gif

属性

目标数组 ☆(_rawArray

对象数组类型``可读写

用于被查找索引的数组。

数组的元素可以是字符串数字对象等各种类型。 其中,输入(组)属性用于传入被查找的元素。

严格程度 ☆(_strict

对象数组类型``可读写

比较包括数值和类型,可选择不同的匹配严格程度。

参数说明:

  • 最宽松:不区分类型,比如0falsenull都认为相等,1true都认为相等。
  • 一般:区分类型。其中对象类型判断值是否相等,不判断是否(引用)相同(二次开发用户才需关心)。
  • 最严格:主要用于对象判断,需要引用也相同,不仅值相等。(通常不要勾选这里,到**一般**即可!

详见数学逻辑计算中的严格程度 ☆(_strict)

获取数组长度(arrLen

说明

往往输入(组)中传入数组,执行时输出长度,比如传入:

 ["hello", "uiotos", "welcome", "!"]

执行后将输出4。如下所示:
20240803191848_rec_.gif

属性


更多参见公共-函数属性

获取组件属性值(formValues

说明

本组件能获取其他组件的属性值,或表单、纯表单数据。其中,获取表单时,与获取组件表单数据组件作用一致,区别在于本组件需要其他组件连线指向输入(组)属性,而不是填入该组件的标识。如下所示:

注意:连入本组件输入(组)的交互连线,默认为虚线。因为这里目标组件是主动获取,不是被动等来源组件事件触发连线传递。与通常的连线执行和属性传递不同。因此连线外观上有区分。

20240802220527_rec_.gif
此外,本组件能获取纯表单数据,不依赖于容器组件(参见常规组件纯表单如何获取?)。以下分场景,重点介绍获取属性值用途。

主动获取

即主动获取单个组件的指定属性值。当输入(组)被其他组件连线指向,且关联了

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值