BeX5快速建站工具(二)界面建模(规则)

输入与输出的关系

在上一篇文章中做出的物品信息维护界面中,列表中“物品编码”有个ref属性:

显示

对应输入框有个bind-ref属性的值绑定了物品编码的ref

填表

红色方框里书界面控件的列表树。例如,两个红色椭圆圈的对应关系:

控件的列表树

标签名使用label方法获取:

此处输入图片的描述

设置宽度

本框架采用BootStrap CSS框架,对我来说再熟悉不过了,详细可以参考它的中文站点

在BeX5框架里,每个元素宽度为100%,在它外面有个控制宽度的元素叫coln,用来控制宽度。给外面的元素设置class就能控制大小。这里的响应式设计吧屏幕分成12份,所以在同一行上的元素总宽度要加成12。

例如:

标签外有个col11,有个clsscol-sm-2,意味着在768px以上大小的屏幕里,它占2/12份。

设置宽度

所以,和它在同一行的input就是col-sm-10

此处输入图片的描述

设置必填项

选中“物品名称”的input -> 右键对应的mainData -> 编辑规则

设置必填项

选中“物品名称” -> 在必填项里写上”true”和提示语:

设置必填项


BeX5快速建站工具(二)界面建模(规则)

本文原创自http://laker.me/blog,转载请注明出处,欢迎交换友链

如果本文对您有帮助,微信扫一扫,请我吃个鸡腿吧