实现表单新增修改_白码低代码平台探索:10分钟实现一个表单应用(包含前端)...

99aa2f06840544a241b828a18ffbcfa6.png

在上一篇文章有提到对白码平台的探索会以类似学习笔记的形式写下来分享(有兴趣可以看看原文)

冰糖炖杨梅:初探低代码开发工具——有点意思?​zhuanlan.zhihu.com
e29c1eab6af5a259a7b5c48b3861c0c2.png

本次主要分享实现一个包含前端界面的产品信息增删改功能。

创建产品表存储产品数据

产品表包含属性:品名、规格描述、单价、图片

具体实现:

在“快速开发”中新建菜单“产品”,然后在弹出窗中添加属性。

b278d79b98d21064fa221b82fbff2a7e.png

c33c88ca79ed2353f30b010eddf2a060.png

5bf8629f490132c8baabd1e5a0be1146.png

一个简单的产品表就建好了,到用户端中看看效果。

4eb1297e779e2ec7173b273707a89fe8.png

实现增删改功能

回到刚才的工作台界面,在“功能配置”一栏中点击配置,新建一个“新增”功能按钮实现添加一条产品数据的功能,只需要填写功能名称,功能类型选择“新增”就可以了,“修改”、“删除”功能同理,他不能一次性同时选择新增、修改、删除类型,希望官方能够改进。

ed1551b2013f1df97c0c183c03c44994.png

添加完后,将状态改为上线就可以了。

647407aeb4bc1ff13bede096cd003369.png

到用户端检查效果

2a66d7b3efb6fe4e7a0bd326b1ef20d2.png

34354c799577d10dc038be74b80d8066.png

在功能配置中单击功能,可以看到里面的具体实现,我理解为一个流程引擎工具,他提供了挺多类型的步骤,这部分内容等我研究多点后,再另开一篇笔记专门记录介绍。

fbdd84aed5ac6d61960151f0af5ca502.png

70ecd145ac5b76b4e3696db97e926cad.png

实现前端界面

前面实现的只是一个类似后台数据管理界面,对用户来说不是特别友好。下面用平台提供的前端界面(官方说法是自定义页)模板简单实现一下。

1、新建“自定义页”类型菜单,选择一个数据列表模板。

fe0f1a416ed50e7f7abb93c3868b4d62.png

110d8743071b1de8d2d66ab104d1b10e.png

2、点击编辑页面,对接产品数据(界面感觉有点像原型工具):选中列表,将数据源设为产品列表(其实前面创建表的过程平台会给我生成一个数据集的流程,当做数据视图就行)。并将产品表的属性映射。

c0626914c991c37b99ed030c6dce7e21.png

3、映射完列表后,还有将列表中的其他图层的数值对应上(感觉有点重复操作了),比如品名图层,对应列表中的品名,其他我就不一一说了。

20d8cedae5e7f234cf99aa63acee86bf.png

4、将增删改的功能对接上按钮:在对应按钮上的触发中选择点击执行功能就可以了。

bb8feff548044228eca82fc34c90c85d.png

弄完后点击保存,在客户端中查看效果。

bcd3a575183bfa6658b5ccb2fe7c5d37.png

b3595f9d2d88b765554b831dc4197797.png

313c6abe6521e55c8f22dca995667f39.png

总结

整体上算是实现了一个具有前端页面的产品管理表单应用,时间上也花费不到10分钟(前提得学会一点怎么玩这个平台)。

这个平台在功能上应该说挺强大的了,也比较容易上手,不过还有挺多坑,我从零开始靠翻官方的帮助文档翻了一个下午学习才会上手(没错,仅仅是上手)。

包括他的流程步骤类型、自定义页的组件、编程、API等,我能想到后面还有很多坑等着我踩......

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值