低代码相关

Posted by Qz on July 21, 2022

“Yeah It’s on. ”

正文

从 0 打造通用型低代码产品

https://mp.weixin.qq.com/s/_dyeI-X-9Q2BNlaCAyH3Yg

「低代码平台作用在于降本增效提质,核心在于模型设计,降低各个功能点的耦合度,让平台支持跨平台」

「低代码平台的核心在于模型设计,包括控件模型、组件模型、画布模型等等」

常见低代码平台都包含三个核心模块:

  • 「控件区」:展示平台内支持的控件,用户通过拖拽控件到布局区,即可展示控件对应的 UI 组件样式;
  • 「布局区」:用来承载控件对应的 UI 组件,用户可以对每个 UI 组件进行布局,并且直观查看页面效果;
  • 「属性编辑区」:用来展示该控件支持的配置内容,可以更加灵活的对每个控件对应的 UI 组件进行自定义设置。

事件处理

为了降低组件和事件处理逻辑之间的耦合度,我们可以在组件和事件处理逻辑中间增加一层,即事件总线:实现通用组件派发事件到事件总线,不同的业务场景监听事件,执行具体的事件处理逻辑。

通过事件总线,将派发事件和监听事件的双方互相解耦,完成解耦后,还能够实现「跨平台」的功能,「对于派发相同的事件,只需要在不同平台监听该事件,实现不同的处理逻辑即可」

数据源

所谓「数据源」即低代码平台中数据来源,通常按照业务需求可以将数据源分为两类:

  • 「静态数据源」:数据绑定在页面配置中,在最终效果页时,直接使用页面配置中的数据,无需通过接口获取数据;
  • 「动态数据源」:一般是保存数据源的接口在配置中,不绑定数据,在最终效果页时,客户端需要再发送请求获取数据。

补充

DataTransfer对象

https://www.zhangxinxu.com/wordpress/2018/09/drag-drop-datatransfer-js/

DataTransfer.dropEffect 影响拖拽中的鼠标手势

DataTransferItem的属性和方法测试实例页面