可视化编辑器是进行低代码开发的的核心工具,而低代码作为一种研发形式,是以纯代码研发方式为基础的,我们可以从现代前端研发的几个要素入手去解构低代码可视化编辑器。
- 视图层的基础——画布。画布的核心是拖拽,调整视图元素的位置关系,主要有容器布局和自由布局两种方式,目前容器布局方式采用较多。
- 组件化时代——属性设置器。现代前端是组件化的时代,使用组件就是设置属性,因此设置器是用户在低代码平台上操作的重点区域。
- 现代前端的核心——数据绑定和更新。我们平时已经习惯了在html标签里面放数据变量进行数据绑定,通过setState等方法进行数据更新,低代码平台一般是通过在组件的属性设置器中声明绑定变量进行数据绑定,通过自定义事件代码调用setState等方法进行更新。这个部分是低代码平台之间差异比较大的地方,特别是全局状态值的设置和事件代码的写法。
- 更多编程要素——事件声明,循环绑定,条件渲染,插槽等,都是必须具备的能力。
低代码方向上不只有前端低代码,还有服务端低代码,服务端低代码核心要素有数据模型定义和逻辑可视化,以及一些代表性工具,如流程引擎、系统互联工具和RPA等。目前前端同学主要关注前端低代码,但是打通任督二脉之后的全栈低代码会比单纯前端更高效。