一飞开源，介绍创意、新奇、有趣、实用的免费开源应用、系统、软件、硬件及技术，一个探索、发现、分享、使用与互动交流的开源技术社区平台。致力于打造活力开源社区，共建开源新生态！

一、开源项目简介

dooringx-lib 是 dooringx 的基座，是移除了 dooringx 插件的可视化拖拽框架。

dooringx-lib 提供自己的一套数据流事件机制以及弹窗等解决方案，可以让你更快地自己定制开发可视化拖拽平台。

dooringx-lib 在运行时维护一套数据流，主要分为json数据部分，左侧组件部分，右侧配置项部分，快捷键部分，弹窗部分，事件与函数部分，数据源部分。

其除了提供基础的拖拽、移动、缩放、全选、旋转等功能外，还可以使用暴露的组件。如果觉得组件不够定制化，可以调整样式或者自己重新写。

二、开源协议

使用MIT开源协议

三、界面展示

✂️快照 | Screen Shots

四、功能概述

开箱即用

提供的底层能力，帮助开发者零成本上手，让所有注意力都能放组件开发与应用设计上

Typescript支持

提供良好的ts定义支持，让编写组件更加轻松

可扩展可配置

不止是组件，快捷键、事件系统、ui层面都可自行配置与扩展

五、技术选型

二次开发安装 | Installation

npm/yarn  install dooringx-lib

项目上手 | Quick Start

# 克隆项目

# 进入项目目录
cd dooringx

# 安装依赖
yarn install

# 启动 dooringx-lib
yarn start

# 启动基础示例
yarn start:example

# 启动 dooringx doc 文档
yarn start:doc

同步代码 | Synchronizing Code

# add upstream

# 抓取源仓库修改 master分支
git fetch upstream main

# 切换分支
git checkout main

# 合并远程分支
git merge upstream/main

表单验证提交思路

表单验证提交有非常多的做法，因为数据全部是联通的，或者直接写个表单组件也可以。

在不使用表单组件时，简单的做法是为每个输入组件做个验证函数与提交函数。

这样是否验证就取决于用户的选取，而抛出的输入可以让用户选择放到哪，并由用户去命名变量。

在点击提交按钮时，调用所有组件的验证函数与提交函数，使其抛给上下文，再通过上下文聚合函数聚合成对象，最后可以通过发送函数发送给对应后端，从而完成整个流程。你可以在example中试下这个demo。

如果操作人员能看懂后端提供的接口文档，那么就可以让操作人员自己通过命名来拼出后端想要的字段。

如果不需要文档，那么某些值也可以在开发时写死。

另外的做法是可以专门写个提交按钮，固定了参数，以及部分规则，比如规定在页面中的所有表单都会被收集提交。

那么我们可以利用数据源，将所有表单输出内容自动提交给数据源，最后的提交按钮按数据源规定格式的key提取，发送给后端。

六、源码地址

访问一飞开源：https://code.exmay.com/