整个可视化搭建系统分为三部分，分别是配置页(setting),视图页(view) 和 json schema。配置页生成 json schema，视图页消费 json schema 可创建的页面类型有：列表、详情、表单。详情和表单页的设计思路差别不大，列表页与另外两种页面差别比…

最终效果实现功能：主页面结构：左侧可选组件列表、中间容器画布、右侧编辑组件定义好的属性从菜单拖拽组件到容器；单选、多选；容器内的组件可以拖拽移动位置；组件拖拽调整宽高；组件拖拽贴边，显示辅助线；操作栏

建议结合源码一起阅读，效果更好（这个 DEMO 使用的是 Vue 技术栈）。 1. 编辑器 先来看一下页面的整体结构。 这一节要讲的编辑器其实就是中间的画布。它的作用是：当从左边组件列表拖拽出一个组件放到画布中时，画布要把这个组件渲染出来。 用一个数组 componentDat…

俗话说得好，工欲善其事必先利其器。本文阿宝哥将介绍一些优秀的开源项目，利用这些开源项目，你将能能轻松应对以下十个工作场景：文件上传、图片处理、文档处理、网络请求、数据存储、微前端、表单设计器、H5 页面设计器、文档管理和 API 管理。 uppy 是一个体验顺滑、模块化的 Ja…

配合着源码，用心看完这遍文章，你便领悟了封装的精髓，麻雀虽小，五脏俱全。 业务代码之外的代码，我想称之为增值代码。 作为一个程序员，你应该除了完成领导安排的任务，你还应该有一些自己的时间，用来“玩”一些比较有意思的事情。 当现有框架、库满足不了我们需求的时候，我们应该尝试去自己…

最近在做一个前后端分离的项目，前端使用 Vue+ Element UI，而后端则使用 Lumen 做接口开发，其中分页是必不可少的一部分，本文就介绍如何基于以上环境做一个简单、可复用的分页功能。 后端做的事情不多，只需要接受几个参数，根据参数来获取数据即可。 然后就可以根据这两…

第一次写博客,菜的一批,只想记录自己成长道路的一路心血,毕竟快奔三的人转行过来前端不容易啊.因为喜欢看掘金的博客,大咖很多,所以选择这里向前辈看齐.

前些日子碰到了动态渲染表单的需求，在这里记录一下，也许能帮到大家。 本文着重梳理动态渲染思路，关于超级表单，由于还不够完善，就不做赘述。 了解这些后，我们再来一步一步实现这个组件。 第二步，设置默认值。 因为在每个form-item都会需要一个v-model，所以在渲染之前，保…

我的工作主要是做B端的后台管理系统，也因此经常需要与表单打交道。各种乱七八糟的表单写多了之后，就会开始想为啥不用动态生成的形式去生成表单，这样就可以花更多地时间去 划水 研究其他的内容。 之后一段时间陆续找了十几个开源的插件,发现并不能满足自己的全部需求，便产生了自己造个轮子的…