写在前面
上一篇博客 在完全脱离文档的情况下了解了 AppCube,对其有了一个基本面的认识,作为一个尝试者,本篇博客还是不借助文档,只依赖自己的经验,实现一个小闭环,这个闭环小到模型中只有一个字段,但我们要实现一个闭环,即从前台输入数据,然后在从后台读取数据。
首先我们创建一款空白应用,这样子就能得到一个原汁原味的界面了。
此时才发现,AppCube 竟然是一个 SAAS 空间,而且好像还在一个地方看到了类似的广告语,翻阅首页发现,原来是 【高效易用的低代码 aPaaS 平台】。
对象模型
进入到控制版面之后,直接找到 Model
目录,点击右侧的 +
,添加对象模型。
输入对象名,就可以操作对象中的相关字段了,其中 AppCube 给我们内置好了一些默认字段,这些字段在开发中非常重要。
切换到自定义字段选项卡之后,就可以创建自己的字段了,AppCube 非常合理的预备好了前缀和后缀。
在自定义字段时,还可以选择字段的数据类型,这里创建了一个名称为 info_name
的字段,然后 AppCube 按照驼峰命名规则对其进行了格式化操作。标准名称为 hys__infoName__CST
。
对象字段的各个属性也可以单独配置。
编写页面
在 Page
目录中直接添加一个【标准页面】,然后拖拽一个表单组件到窗口中,这里 AppCube 会自动等待我们选择一个对象,将其绑定到表单组件上,如下图所示。
这里数据绑定的模型是 对象
,因为它能由后台对象模型映射创建,支持选择字段,这里的后台对象模型就是上文我们创建的模型。
其它表单组件的配置都非常简单,例如文本标签,占位符,鼠标移动显示,是否可清空,基于需求配置即可。
输入页面最后一个步骤是,按钮操作,也就是我们需要给提交按钮绑定事件,让其可以提交数据到后台,选中按钮之后,发现 AppCube 这一步骤也已经考虑到,已经初始化好相关事件了。
点击【提交表单】后面的铅笔图标,得到【内置动作】编辑窗口,可以自行调整逻辑,非常方便。
接下来实现数据呈现部分
在 Page
目录中创建一个名称为 Show
的标准页面,然后直接拖拽一个表格到窗口中。
后续的步骤与上文基本一致,绑定模型,修改显示相关字段。
而且想要添加筛选条件也非常容易,直接在属性面板操作即可。
预览最终效果 c
在预览之前,需要修改一下相关菜单,这个步骤也是失败一次之后发现的,AppCube 默认打开的页面,并不是咱们创建的页面。
配置非常简单,直接参考下图操作区域即可实现。
保存上述所有操作,然后点击左侧的 APP 预览。当出现如下所示页面时,本次案例的全部工作已经完成。
数据输入界面
数据预览界面
由于没有删除按钮,我回到了 Show
设计页面,添加了工具栏,这样选择与删除功能就被启用了。
最后开启表格的选择列,如下所示。
写在后面
虽然本例只涉及了一个字段,但这足够精彩了,有这一个小闭环的实现,就可以将其扩展开了,任何表单收集与呈现的工作,都可以在无代码的情况下编写。真的符合了应用魔方的神奇之处在于,你把它拖拉拽操作一番就能实现快速应用开发和应用构建。