编辑器的介绍和产品设计

作为一个低代码平台，每个公司的业务不一样，需要的编辑器也不一样，我这里介绍的比较全一点：

页面编辑器：构建基本的页面，比如：表单页面，图表页面，管理类的系统都需要这种编辑器，供PC端使用

移动端编辑器：构建移动端的页面，比如：一个app可以通过这个编辑器构建出来

流程编辑器：构建一个业务流程的编辑器，比如：审批流

逻辑编辑器：构建一段逻辑的编辑器，比如：封装前端的逻辑供其他编辑器使用，封装后端的逻辑供其他编辑器使用

组态编辑器：构建组态画面的编辑器，比如：在物联网系统中经常需要组态画面表示现场的设备

大屏看板编辑器：构建大屏看板的编辑器，比如：在展厅或者老板办公室，展示公司某一项业务的运营情况

3D编辑器：构建3D效果的编辑器，比如：工厂的数字孪生效果

自定义报表编辑器：构建自定义报表的编辑器，比如：工厂的表单，出货申请单，支持打印功能

报表编辑器：具有合并单元格，新增单元格等功能的报表编辑器

对于这些编辑器，我推荐几个第三方库：

• Formily
• 乐吾乐
• avue

同时我也推荐几个非常好的竞品：

• Mendix
• 蓝卓
• 云雀
• 繁易
• 有人云
• 帆软

编辑器的产品设计：

用户在使用编辑器进行构建时，需要做的操作有以下几个重要步骤：

1.从组件区域，把需要的组件拖拉到编辑区

2.对组件的属性进行设置，属性区分属性设置，事件设置，动画设置等，其中属性设置里面最重要的就是数据源的绑定

3.保存

4.编译发布

一个好的编辑器要注意一下几点：

• 组件可以用户自定义上传，这个我们可以用私仓或者做项目隔离
• 组件可以运营方自定义上传，这个我们可以用公仓或者做全局更新
• 组件在绑定数据源的时候，一定不要直接去绑接口，要跟数据模型进行关联和绑定，如果有一些数据没办法通过数据模型搞定的，可以用action的方式，在这个action里面可以写接口，这样子是为了可以管理这个页面里面绑定的所有接口，方便后续维护
• 组件之间的联动，需要有事件的触发，在事件触发的回调设计上，也要用action的方式或者使用逻辑编辑器构建出来的产物，这个是为了可维护性和可复用性，脚本尽量少些，即便要用脚本，也要把它管理起来，就跟组件在定义时，有哪些方法一样
• 变量体系的设计，比如：全局变量，页面变量，组件变量，临时变量，这个在后续组件之间，页面之间的联动具有关键作用
• 组件的定义要有一些易用性的设计，比如：布局组件模板，组合组件
• 页面在创建时，要支持基于模板创建，这样子我们后续可以积累很多行业的模板
• 编辑器要提供一些易用性的功能，比如：二开组件，用户可以把任何几个组件保存为二开组件，二开组件暴露出来的属性，用户可以自定义
• 编辑器的产品定义非常重要，比如：移动端编辑器用来构建app的，页面编辑器用来构建布局自适应的普通页面的，组态和大屏看板编辑器用来构建绝对布局的画面的，逻辑编辑器用来构建逻辑流的，这个是最重要的，在前期的产品定义这块，一定要调研清楚，后续会对研发的技术选型，架构设计以及技术实现上造成很大的影响

后面，我会通过一个综合编辑器（有组态，大屏看板，报表等编辑器的能力）和页面编辑器的产品定义来详细讲解怎么做一款好的编辑器