1、打造通用 MIS 平台，彻底释放前后端人力用可视化的方式让MIS系统开发提速至少20倍即：信息管理系统什么是 MIS？为什么要通用 MIS？需要通用化适合通用化需求最多缺乏成就感重复劳动最多功能相似度高功能性为主、视觉要求不高采用什么方式开发？jQueryMVVM完全声明式命令式部分声明式如何实现？简化组件使用方式Formtitle:string data:object onSubmit:Function Formtitle:string initApi:string api:string redirect:string 传统组件高级组件固化行为高级组件调用过程可简化成节点配置+配置节点UI

2、组件行为实现渲染器来个简单栗子用代码实现用配置实现再来个复杂点的栗子用代码实现用配置实现Xxx 列表分类1分类2分类3新增 条件检索 通过关键字搜索搜索批量删除批量标注Xxx 列表分类1分类2分类3新增 条件检索 通过关键字搜索搜索批量删除批量标注DialogAjaxDialogDialogDialogAjax行为是可固化的初始数据不指定传递 data指定 API根据 controls 配置渲染表单&与用户完成交互验证提交指定 API指定接收组件指定页面地址开始结束Form动作是可枚举的 动作（Action）发送 Ajax打开弹框关闭弹框刷新目标提交表单复制内容页面跳转。技术选型：Typesc

3、ript+React具体技术实现配置化原理总结用户JSONRenderer ARenderer BRenderer Component 1Component 2Component 3Component 4Component PageButtonCRUDTableFormColumnsTextImageOperationsTextButton解决渲染过程 先注册渲染器/page/page/body/1/crud/page/body/0/button/page/body/1/crud/filter/form/page/body/1/crud/table/n/text/page/body/1/cru

4、d/table/n/operation/page/body/1/crud/table/page/body/1/crud/filter/form/0/text解决渲染过程 完成节点渲染如何管理数据？State?Redux?MobX?MobX State Tree!如何管理数据？Store Factory（HOC）Renderer(渲染器)动态创建与销毁 store 并下发 建立store间树形关系 维系数据原型链Store Factory（HOC）Renderer(渲染器)动态创建与销毁 store 并下发 建立store间树形关系 维系数据原型链Renderer(渲染器)如何管理数据？Page

5、CRUDTableRow数据扩充数据原型链如何满足联动需求显隐联动数据联动手动更新自动更新visibleOn 表达式reload 目标组件自动监听 依赖变化组件间如何通信建立一个作用域链 提供渲染器将自己注册进来的接口 提供根据名字查找组件服务Scoped（HOC+Context）Renderer(渲染器)如何满足视图定制需求丰富自身组件TPL开放组件定制渲染器架构图FactoryJSONJSX.ElementPageFormCRUDWizardTextActionButtonSelectNumberTabsModalDrawer渲染器HOCQuickEditableCopyableScope

6、dPopOverableStoreServiceFormCRUDTabsTPLDrawerSelectNumberEditorRichTextImageFile组件LayoutLazyComponentJSON 编辑器（MonacoEditor）+JSON Schema如何打造编辑器？可视化编辑器如何打造编辑器？PageButtonCRUDTableFormColumnsTextImageOperationsTextButton可视化编辑器实现原理节点可定位 添加编辑交互Editor（HOC+Context）Renderer(渲染器)可视化编辑器实现原理节点 ID 设置到 DOM 节点 Hov

7、er 状态显示渲染器信息 选中状态显示 Toolbar 完成每个 toolbar 操作 组织编辑器树形关系Editor（HOC+Context）Renderer(渲染器)节点 ID 设置到 DOM 节点 Hover 状态显示渲染器信息 选中状态显示 Toolbar 完成每个 toolbar 操作 组织编辑器树形关系可视化编辑器实现原理可视化编辑器实现原理通过渲染器（自己）完成配置隐藏节点&无视图节点 弹框中的配置 拖拽容器切换 视图更新优化还有更多细节通过平台可更大化降低成本平台系统1可视化编辑器系统2系统3系统4系统页面管理用户/角色管理权限定制文件、图片上传云端ServerlessAPI Mock自定义组件操作日志页面统计API Proxy更多公共服务。菜单定制用户认证平台可直接用 node 编写业务 通过脚手架、分析数据库、生成代码、后端代码也可省！Serverless前端后端React-Router Layout 渲染器平台实现Node Yog2(基于 Express)VMScriptRestfull API一个中等复杂页面开发只需 20 mins 接入部门 100+创建页面数 1.2w+每天活跃页面 1.8K 活跃群组 300+PV：10W UV：2.6K 去年春晚红包策略配置也是用 AMis 完成的AMis在公司内的收益