5 Star 16 Fork 13

tanchengduo / form-design-tcd

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
MIT

指南

基于vue和element-ui实现的表单设计器,主要功能是使使用者在图形界面配置所需的表单,生成可保存的JSON数据,并能将JSON还原成表单,使表单开发更简单更快速

预览地址
[GitHub]源码开源地址
[码云]源码开源地址

An image 特性

  • 可视化配置页面
  • 自由控制表单控件布局
  • 表单自定义样式(以行内样式插入)
  • 提供预览、保存、生成json、生成可执行代码等操作
  • 支持表单验证
  • 快速获取表单数据
  • 提供高级控件

    vue element-ui license

感谢

创作感谢k-form-design给予的灵感

版本

vue

设计原则

form-design-tcd本着所有表单控件特性尽可能可视化配置。

快速上手

1.安装vue-cli

 npm install -g @vue/cli
 # OR
 yarn global add @vue/cli

2.创建一个项目

使用初始化项目命令

 vue create myapp

3.安装form-design-tcd

 npm i form-design-tcd --save
 # OR
 yarn add form-design-tcd

4.使用form-design-tcd

在项目main.js中

 import FormDesignTCD from 'form-design-tcd'
 import "form-design-tcd/lib/form-design-tcd.css"
 Vue.use(FormDesignTCD)

以上步骤便完成便可在项目中直接使用form-design-tcd。
form-design-tcd内置了两个组件分别为FormDesignTCD和FormBuildTCD。

建议

form-design-tcd基础组件样式引用的element-ui的组件库,在使用过程中一些表单控件特性可查阅element-ui官方文档

MIT License Copyright (c) 2020 TanChengDuo Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

简介

一款基于vue和element的表单设计器 展开 收起
JavaScript
MIT
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
JavaScript
1
https://gitee.com/tanchengduo/form-design-tcd.git
git@gitee.com:tanchengduo/form-design-tcd.git
tanchengduo
form-design-tcd
form-design-tcd
master

搜索帮助