跟我一起写低代码开发平台之五组件的属性模型

跟我一起写低代码开发平台之五组件的属性模型在上篇文章中《跟我一起写低代码开发平台之四组件模型》,我负责的低代码开发平台讲到组件模型的五元组模型,今天重点讲一下,在低代码开发平台这个产品,

在上篇文章中《跟我一起写低代码开发平台之四组件模型》,我负责的低代码开发平台讲到组件模型的五元组模型,今天重点讲一下,在低代码开发平台这个产品,我是如何定义每个元组元素的元素模型。

一、属性模型规范定义

对于组件的属性模型的规范定义,我采用如下<数据绑定、基本属性、公共属性、校验规则、移动端属性> 五元组元数据。

跟我一起写低代码开发平台之五组件的属性模型

组件属性模型定义

模型绑定:组件构建的模型实体的属性,维护模型驱动的方式生成此组件的模型引用关系

基本属性:定义组件的基本属性或者私有属性,如组件的标签、名称、大小等属性

公共属性:定义组件的公共属性,如组件的关联模型、只读、隐藏、禁用等属性

校验规则:此组件的数据校验操作,包括校验规则、提示语、错误提示信息等

移动端属性:如果要实现组件的移动端渲染,组件在移动端的属性规范定义

以文本输入框举例,实现如下:

跟我一起写低代码开发平台之五组件的属性模型

属性模型定义

每种模型定义都采用DSL进行描述

二、样式模型规范定义

对于前端组件样式,样式模型采用元数据<布局、字体、背景、边框、阴影>五元组进行定义:

跟我一起写低代码开发平台之五组件的属性模型

样式模型规范定义

以文本输入框举例,具体实现如下:

布局定义

跟我一起写低代码开发平台之五组件的属性模型

布局定义

字体定义

跟我一起写低代码开发平台之五组件的属性模型

字体模型

背影定义

跟我一起写低代码开发平台之五组件的属性模型

背影模型定义

边框定义

跟我一起写低代码开发平台之五组件的属性模型

边框模型定义

阴影定义

跟我一起写低代码开发平台之五组件的属性模型

阴影模型定义

三、事件模型规范定义

组件的事件模型,我采用元数据<名称、事件、动作、对象>四元组进行定义,规范定义如下:

跟我一起写低代码开发平台之五组件的属性模型

事件模型

以Button为例,实现如下:

跟我一起写低代码开发平台之五组件的属性模型

按钮的事件模型

对于数据模型的规范定义,由于内容比较多,我放到下一个章节单独来讲。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
转载请注明出处: https://daima100.com/4316.html

(0)

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注