前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >必须知道的几款优秀可视化表单、流程开源设计器

必须知道的几款优秀可视化表单、流程开源设计器

作者头像
main方法
发布2020-12-07 11:08:53
8.2K0
发布2020-12-07 11:08:53
举报
文章被收录于专栏:main方法main方法

前言

 随着互联网的快速发展,越来越多的云建站平台快速崛起,不可避免的就是自定义可视化设计,如何不通过开发就能够简单快速的搭出一个可用的页面就成了大家头痛的问题,但是从零开始开发设计一套可视化设计功能并不是一个简单的事情,还好有很多开源的可视化设计项目/组件可以供我们使用,今天我们就来看看这些开源可视化设计项目。


一、FormRender

易用的跨组件体系的表单渲染引擎 - 通过 JSON Schema 快速生成自定义表单配置界面

Github Star 数 1938 , Github 地址:https://github.com/alibaba/form-render/stargazers 官方文档地址:https://x-render.gitee.io/form-render 协议:

  • 遵循 MIT 协议
  • 请自由地享受和参与开源
  • 如上图,使用 Schema 编辑器 快速生成可实现低上手成本、快速搭建
  • 支持 Ant Design 和 Fusion Design 主流的视觉主题
  • 使用 JSON Schema 标准协议描述表单配置,并搭配丰富类型且可扩展的组件
  • 支持 1 排 N、横纵排、支持对象无限嵌套、自定义正则校验、自定义样式组件、列表拖拽等特性
  • 已在阿里云、淘宝、天猫、飞猪、亚博科技、安全智能、新零售行业工作台、人工智能实验室等多 BU 多场景使用,简单使用同时支持复杂场景使用
  • 使用上有详细文档,维护上有专人支持

二、form-generator

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

GiteeStar 数 1.3K, Gitee地址:https://gitee.com/mrhj/form-generator?_from=gitee_search 演示地址:https://mrhj.gitee.io/form-generator/#/ 协议:

  • 遵循 MIT 协议

三、f-render | 基于 ElementUI 的表单设计器

f-render 是基于 vue-ele-form 开发的可视化表单设计工具, 适用于 各种流程引擎和动态表单项目,大大节省你的开发时间;

GiteeStar 数 1.1K, Gitee地址:https://gitee.com/dream2023/f-render?_from=gitee_search 演示地址:https://dream2023.gitee.io/f-render/ 协议:

  • 未声明

四、easy-flow

基于VUE+JsPlumb的流程设计器

Gitee Star 数 1938 , Gitee地址:https://gitee.com/xiaoka2017/easy-flow 演示地址:http://xiaoka2017.gitee.io/easy-flow/# 协议:

  • 符合项目package.json中使用的插件中规定的协议即可

功能介绍

  • 支持拖拽添加节点
  • 点击线进行设置条件
  • 支持给定数据加载流程图
  • 支持画布拖拽
  • 支持连线样式、锚点、类型自定义覆盖
  • 支持力导图

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2020-11-26,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 main方法 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 前言
    • 一、FormRender
      • 二、form-generator
        • 三、f-render | 基于 ElementUI 的表单设计器
          • 四、easy-flow
          领券
          问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档