新功能之自定义表格组件应用

张海涛 · 产品博客
220
在低代码平台上,我们可以通过自定义表格进行子表 的逻辑表达,一般场景为 单行添加,多行批处理,以及一行数据之间的互相联动关系等

1、在PC端 新建一个页面,添加自定义表格组件并绑定数据入库单明细 中list 字段

(注意list 字段为列表类型,且在编辑时尽量保证有一条数据返回,方便页面配置)

2、初始表格默认是文本组件,需要手动删除拖拽不同组件,如下拉框,输入框等,拖拽组件后修改组件名称为对应接口绑定的字段名称,方便取值映射

3、组件数据绑定选择对应字段

4、单行添加:打开子表动态添加开关,并配置列名(打开动态添加后会自动关闭分页逻辑,并且表格会多出一个添加行的按钮,多出一个操作列用作动态删除)

5、多行添加:点击页面下方添加弹窗,拖一个表格,配置选中列值,下拉框选择“多选”

确认按钮事件配置如下 表格选择取值-选定数据
自定义表格选择设置,并将对应映射关系填写
关闭弹窗

6、关于一些业务逻辑的配置演示

比如:
下拉框选择商品,重新赋值给这一行的输入框
自动计算总价

下拉框选择商品

条件判定防止重复触发值变化多次频繁调用接口(可选)
说明:在批量添加数据的时候,每行的下拉框都会触发值变化事件导致每次值变化都会调用接口,如果不想频繁调用接口,可以使用条件过滤掉批处理的影响
自定义表格取值-当前行
接口调用时的参数要选择对象-子表-当前行-“实际值”(不能选择组件)
接口返回值通过组件设值 给当前行赋值

自动计算总价

实际数量配置值变化事件,自定义表格 节点选择取值当前行
判断当前行实际数量 是否为空过滤异常情况
选择脚本相乘逻辑,把实际数量与金额相乘(脚本需要自己写)
将计算结果重新赋值给当前行总金额

最新回复 (0)

    暂无评论

请先登录后发表评论!