关于低代码平台的思考

      在项目实战开发中,尤其是在大平台系统的搭建中,针对不同的业务场景,需要为用户多次编写不同的表单页面用于录入、修改、展示操作,一旦表单过多,对于开发人员来说,算是一种重复开发,甚至是一种繁杂的工作。但是,随着技术发展,前端JS框架的不断成熟,降低前端开发工作量,自动生成统一表单的技术,越来越成熟,随之而来,诞生了低代码的思路。
低代码,简单理解就是通过拖拽,即可生成页面,同时能够保持页面的统一风格,快速搭建页面,生成前端代码。
前端开发框架VUE的风靡全球,简单,快速,结合VUE,表单生成器诞生,下面是基于VUE的几种比较不错的表单生成器,通过拖拽即可实现表单的布局、代码的生成

1.Form Generator

Element UI表单设计及代码生成器,可将生成的代码直接运行在基于Element的vue项目中;也可导出JSON表单,使用配套的解析器将JSON解析成真实的表单。

 

 

码云仓库: form-generator: Element UI表单设计及代码生成器

演示地址: form-generator

安装依赖:

npm install
JSON解析器:

// 安装
npm i form-gen-parser
vscode插件 form-generator-plugin

此项目将form-generator的vscode-plugin分支封装为一个vscode插件,拓展了form-generator的文件写入能力; 帮助使用element UI的开发者完成基本的表单代码搭建任务,减少重复的劳动。

2. 基于vue+ant-design-vue的表单设计器 k-form-design

设计器布局参考form-generator项目,基于vue和ant-design-vue实现的表单设计器,样式使用less作为开发语言,主要功能是能通过简单操作来生成配置表单,生成可保存的JSON数据,并能将JSON还原成表单,使表单开发更简单更快速。

 

 

 

github仓库:https://github.com/Kchengz/k-form-design

演示地址:http://cdn.kcz66.com/form-design.html

组件

KFormDesign 表单设计器(基于可视化操作快速设计出表单页面,生成配置json或页面)
KFormBuild 表单构建器(根据设计器中获取的配置json数据,快速构建出表单页面)
安装

# 使用yarn
yarn add k-form-design

# 使用npm
npm i k-form-design --save
引入组件

// 在main.js引入

import KFormDesign from 'k-form-design'
import 'k-form-design/lib/k-form-design.css'
Vue.use(KFormDesign)
使用组件

<template>
<div>
<k-form-design />
</div>
</template>

 

3.基于vue的表单生成器(支持iview,element-ui,ant-design-vue) form-create

 

 

 

form-create 是一个可以通过 JSON 生成具有动态渲染、数据收集、验证和提交功能的表单生成组件。支持3个UI框架,并且支持生成任何 Vue 组件。内置20种常用表单组件和自定义组件。

安装

iview

npm install @form-create/iview
iview

npm install @form-create/iview4
element-ui

npm install @form-create/element-ui
ant-design-vue

npm install @form-create/ant-design-vue

4.基于vue+ElementUI的表单设计器form-designer

 

 

 

码云仓库:https://gitee.com/wurong19870715/formDesigner

演示地址:http://wurong19870715.gitee.io/formdesigner

 ----------------分割线----------------------------------
 
以上表单生成都不错,从我自己的角度,都是为了生成JSON文件,如果再深入思考下,从实际开发流程来说,一旦业务场景确定,往往都是先确定数据表结构,再进入开发。
是不是可以考虑,基于业务数据库表结构,利用这个表单生成器,先生成一版通用的,生成主业务场景画面的表单,然后由开发人员再根据实际进行调整,例如通用的都生成是普通text表单,然后可以根据需要调整成其他类型的表单,例如日期选择、下拉选择等,然后再保存到数据库中,这样可以不用前端开发人员的协助,能够自动生成画面,甚至直接推送到项目代码中,整个过程甚至直接脱离前端开发人员?
这样起码来说,增删改查列表的通用画面就能够快速完成,这样速度会大大提升。
我相信,国内应该已经有公司这么做了。
 
 

参考资料

https://blog.csdn.net/weixin_43765747/article/details/122995904

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章