精华内容
下载资源
问答
  • 功能特点可视化设计表单一键生成原生的vue单页表单代码,保持100%拓展性在线编辑器修改生成的代码,并实时预览表单栅格化布局支持表单校验快速查阅组件的官方文档vscode插件在上文的设计器的基础上,封装了一个...

    今天给大家推荐一款超逼格的Vue可拖拽表单设计器组件FormGenerator。

    83f529f81f309c6b10605be44840de0d.png

    form-generator 基于 Vue.js+ElementUI 高效表单设计组件,star高达1.7K+

    d5af6bd94e4b9daeca29567d1d47fd24.gif

    功能特点

    • 可视化设计表单
    • 一键生成原生的vue单页表单代码,保持100%拓展性
    • 在线编辑器修改生成的代码,并实时预览
    • 表单栅格化布局
    • 支持表单校验
    • 快速查阅组件的官方文档

    vscode插件

    在上文的设计器的基础上,封装了一个vscode插件。突破网页不能写入文件的限制。

    381071be9915b496c856ede98f5b088b.gif

    请在vscode中搜索 jakHuang 或 Form Generator Plugin

    安装使用

    # 下载项目git clone https://github.com/JakHuang/form-generator.git# 进入目录cd form-generator# 安装依赖npm install# 本地开发npm run dev# 构建npm run build
    abe836e8fd192271b9780026c08deb57.png

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

    0a558c60d2f6e61576bd37f77ca29c94.png
    3bf83917a4bcf4f0cef4257d03960c02.png
    4964003f662f49b72e582a85e32d81e9.png
    c7ce77204beea4f46f523bea6f5ff12d.png
    # 预览地址https://mrhj.gitee.io/form-generator/# 仓库地址https://github.com/JakHuang/form-generator

    ok,就分享到这里。希望对大家有所帮助,欢迎一起交流讨论!

    展开全文
  • 简介 Element UI表单设计及代码生成器,可将生成的代码直接运行在基于Element的vue...表单栅格化布局 支持表单校验 快速查阅Element UI官方文档 配套vscode插件 插件 vscode-plugin分支配套插件为:form-generator-p

    简介

    Element UI表单设计及代码生成器,可将生成的代码直接运行在基于Element的vue项目中。

    image

    特点

    • 可视化设计表单
    • 一键生成原生的vue单页表单代码,100%拓展性
    • 在线编辑器修改生成的代码,并实时预览
    • 表单栅格化布局
    • 支持表单校验
    • 快速查阅Element UI官方文档
    • 配套vscode插件

    插件

    vscode-plugin分支配套插件为:form-generator-plugin
    使用插件可右键打开设计器,直接将代码保存到工程中。
    安装插件请在vscode中搜索:

    jakHuang

    Form Generator Plugin

    文档

    源码

    交流

    • QQ群 976154366

    开发计划

    详见 迭代计划
    欢迎提交PR

    PR鸣谢

    开源协议

    MIT

    展开全文
  • 功能特点可视化设计表单一键生成原生的vue单页表单代码,保持100%拓展性在线编辑器修改生成的代码,并实时预览表单栅格化布局支持表单校验快速查阅组件的官方文档vscode插件在上文的设计器的基础上,封装了一个...

    今天给大家推荐一款超逼格的Vue可拖拽表单设计器组件FormGenerator。

    967688e226cc794a49499566627ee407.png

    form-generator 基于 Vue.js+ElementUI 高效表单设计组件,star高达1.7K+

    3eb17a039782f8cf6843dbfd419b9603.gif

    功能特点

    • 可视化设计表单
    • 一键生成原生的vue单页表单代码,保持100%拓展性
    • 在线编辑器修改生成的代码,并实时预览
    • 表单栅格化布局
    • 支持表单校验
    • 快速查阅组件的官方文档

    vscode插件

    在上文的设计器的基础上,封装了一个vscode插件。突破网页不能写入文件的限制。

    7cfdd8f17e26840dc42168a77775dd34.gif

    请在vscode中搜索 jakHuang 或 Form Generator Plugin

    安装使用

    # 下载项目git clone https://github.com/JakHuang/form-generator.git# 进入目录cd form-generator# 安装依赖npm install# 本地开发npm run dev# 构建npm run build
    6b1f56c760f4d2e2c6bdfb01ff63205a.png

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

    1c0a6ad473a8897ec536ac697dbff137.png
    c0438c26ee090d309b7829b0b8e62c90.png
    e2c8e9e05ad8330bd41af0b1a7afc7d2.png
    a2be85c5abc8eab6daf922bd43097cf2.png
    # 预览地址https://mrhj.gitee.io/form-generator/# 仓库地址https://github.com/JakHuang/form-generator

    ok,就分享到这里。希望对大家有所帮助,欢迎一起交流讨论!

    展开全文
  • 布局 音频视频 编辑器 轮播图 弹出层 字符串 表单 存储 动画 时间 其它 CDN 图片 baguetteBox.js - 是一个简单易用的响应式图像灯箱效果脚本。demo Lightgallery.js - 是一个功能齐全的JavaScript图像灯箱插件。...

    轻量高效的开源JavaScript插件和库

    目录

    图片

    布局

    • SuperEmbed.js - 是一个Javascript库,可检测出网页上的内嵌视频并使他们能够变成响应式元素。demo
    • ScrollReveal - ScrollReveal插件使用户能够无比轻松地创建桌面和移动浏览器的网页滚动动画。demo
    • Bricks.js - 是一款超快的用于固定宽度元素的“砖石”布局生成器。demo

    轮播图

    • Swipe - 准确的触摸滑块。demo
    • Lory - 是一个由 Vanilla JavaScript 编写的拥有触摸功能的简约滑块。demo
    • baguetteBox.js - 是一个简单、易用的响应式 Lightbox 图片库,它支持移动端上触滑动手势操作,无依赖。demo

    弹出层

    • Popper.js - 是一个轻量级的库用于管理工具提示和弹窗效果。demo
    • SweetAlert2 - 是一个颜值很高而且可以自定义的警告弹出窗口插件,可以代替Javascript的弹出窗口。demo
    • artDialog - 是一个经典、优雅的网页对话框控件。demo
    • layer - 是一个web弹层组件。demo

    音频视频

    • Loud Links - 是一个轻量级的JavaScript库用于添加交互声音到您的站点。demo
    • flv.js - B 站 HTML5 播放器内核开源。
    • Loud Links - 是一个轻量级 JavaScript 库,用于向您的网站添加交互音频。。demo

    编辑器

    • MediumEditor - 仿Medium.com的所见即所得在线编辑器工具栏。demo
    • Substance - 是一个基于Web的内容自定义编辑器。demo
    • flatpickr - 是一个轻量级的代码高亮库,适用于任何编程语言。demo
    • pen - 是一个Markdown编辑器工具。demo
    • aceAce(Ajax.org Cloud9 Editor)。demo
    • CodeMirror浏览器端的代码编辑器。demo
    • esprima用于综合分析的 ECMAScript 解析器。demo
    • quill一个带有 API 的跨浏览器富文本编辑器。(demo)
    • ckeditor-releases 适用于每个人的 web 文本编辑器。demo
    • editor 一个 markdown 编辑器,但仍在开发中。demo
    • EpicEditor 一个可嵌入的 js Markdown的编辑器,拥有全屏编辑、即时预览、自动保存草稿和离线支持等功能。demo
    • jsoneditor 查看、编辑和格式化 JSON 的 web 工具。demo
    • vim.js  拥有持久化 ~/.vimrc 的 Vim 编辑器的 JavaScript 移植版本。demo
    • Squire HTML5 富文本编辑器。demo
    • TinyMCE JavaScript 富文本编辑器。demo
    • trix 由 Basecamp 制作,适用于每天写作的富文本编辑器。demo
    • Editor.md 由 Basecamp 制作,适用于每天写作的富文本编辑器。demo

    字符串

    • selecting - 一个允许你获取用户选定文本的库。
    • string.js - 额外的 JavaScript 字符串方法。demo
    • he - 健壮的 HTML 实体编码/解码器。
    • multiline - 多行字符串。
    • query-string - 解析和字符串化 URL 查询字符串。
    • URI.js - URL 操作库。demo
    • jsurl - 轻量的 URL 操作库。
    • sprintf.js - 实现字符串格式化。
    • url-pattern - 让 url 和其它字符串进行比正则表达式匹配更简单。字符串和数据可相互转化。

    表单

    • validator.js - 轻量级的JavaScript表单验证,字符串验证。demo
    • List.js - 是一个轻量级的为列表、表格或其他任何HTMLL标签增加了搜索,排序,过滤器和灵活性等元素。demo
    • Algolia Places - 是一个能让你在网页轻易实现搜索栏自动完成功能。demo
    • Cleave.js - 是一个会在你输入时格式化你的<input/>标签里面的内容。demo
    • validator.js - 是一个简单、轻量级,但功能强大的 Validator 组件。demo
    • axios - 是一个基于浏览器和node的HTTP请求库,绿色环保只有12kb。

    存储

    • store.js - 本地存储localstorage的封装,提供简单的API。demo
    • cookie.js - 对操作cookie的封装,提供简单的AIP 兼容IE6。demo
    • store.js - 为所有浏览器封装了LocalStorage,隐秘地使用localStorage、globalStorage和用户数据。
    • localForage - 改善后的离线存储。封装了IndexedDB、WebSQL和localStorage。demo
    • cross-storage - 获得权限后,能跨域名本地存储。
    • basket.js - 用 localStorage 加载和缓存脚本的资源加载器。demo
    • bag.js - 可以缓存脚本和加载资源,增加了键值对接口和对localStorage/websql/indexedDB 的支持。
    • basil.js - 智能的 JavaScript 数据持久层库。
    • Cookies - 客户端 Cookie 操作库。
    • DB.js - 基于 Promise 的、封装了 IndexedDB 的库。demo
    • lawnchair.js - 简单的客户端 JSON 存储。demo

    动画

    时间

    • moment - 是一个日期处理类库,用于解析、检验、操作、以及显示日期。demo
    • timesheet.js - 是一个时间展示片段插件。demo
    • date.js - 是一个格式化时间、过去时间展示、解决因时区变更插件。
    • timeago.js - 格式化时间显示多久以前的插件。 demo
    • rome - 可定制的日期(和时间)选择器。无依赖,可选 UI。 demo
    • moment-timezone - 基于 moment.js 的时区库。demo
    • date - 拥有人性化的 Date() 方法。demo
    • ms.js - 小巧的毫秒转换工具。

    其它

    • hotkeys - 是一个强健的 Javascript 库用于捕获键盘输入和输入的组合键。demo
    • clipboard.js - 现代复制到剪贴板。没有Flash,gzip压缩只有3KB 。demo
    • translater.js - 这是一个利用HTML注释的页面翻译解决方案。demo
    • Push.js - 是一个跨浏览器的Javascript桌面通知插件。demo
    • onlinenetwork - js判断是否断网了。
    • iNotify - 是一个实现浏览器的 title 闪烁、滚动、声音提示、chrome、等系统通知。demo
    • tesseract.js - 是一个文字识别转换,可以运行在浏览器和服务器NodeJS上。demo
    • Leaflet.js - 是一个开源的移动友好交互式地图 JavaScript 库。体积仅有 33 KB。demo
    • CurrencyFormatter.js - 是一款简单纯JS格式化155种不同国家货币格式库,gzip压缩后仅7KB。demo
    • Feature.js - 是一个快速、简单、轻量级的浏览器功能检测库。它没有任何的依赖,并且 gzip 压缩后仅有1kb。demo

    CDN

    转载于:https://www.cnblogs.com/zhnaglei/p/6697638.html

    展开全文
  • 本项目基于Layui、Jquery、Sortable项目中的js代码格式化使用了js_beautify3、项目已经基本实现了拖动布局,父子布局4、项目实现了大部分基于Layui的Form表单控件布局,包括输入框、编辑器、下拉、单选、单选组、...
  • 使用所见即所得的视觉设计器和布局工具为复杂的窗口创建简单的表单;Java代码将为您生成。使用拖放轻松添加控件,将控件添加到事件处理程序,使用属性编辑器更改控件的各种属性,使您的应用程序国际化等等。 Window...
  • 布局 音频视频 编辑器 轮播图 弹出层 表单 存储 动画 时间 其它 CDN 图片 baguetteBox.js- 是一个简单易用的响应式图像灯箱效果脚本。demo Lightgallery.js- 是一个功能齐全的JavaScript图像灯箱...
  • 布局 轮播图 弹出层 音频视频 编辑器 字符串 表单 存储 动画 时间 其它 加载器 构建工具 测试 包管理器 CDN 图片 baguetteBox.js- 是一个简单易用的响应式图像灯箱效果脚本。demo ...
  • 从Elementor编辑器中实时设计所有表单。选择字段,增加间距,设置列和布局。。。控制一切,真正实现即见即所得。 链接:https://pan.baidu.com/s/1RS69Qf5WalRhT4xjnOd2Bw 提取码:点击获取 ...
  • 简化了创建布局,样式和表单的组件,可以从webZap拖放元素来创建文件夹的UI形状和文本 虽然有相当一部分的开发者提倡在浏览器中设计,很大的原因是可以直接的可视化编辑,不过事实上仍然有许多人保持着用photoshop...
  • ■基于FLex弹性布局重写前端(OA平台因要支持传统业务暂不涉及)。 ■提供全新的Bootstrap 4.0技术文档,并获得Bootstrap官方认同,访问http://code.z01.com/v4 ■前后端全面引入scss(sass)技术,与Bootstrap官方...
  • 用 ExtJs 做布局和基础功能,配合多种jQuery插件实现的基于浏览器的web工作流表单设计器,有很多丰富和实用的功能,包括outline、画布、属性编辑器、很灵活的属性配置和右键菜单,还有撤销、重做、剪切、复制、粘贴...
  • OpenOffice.Org 3 的插件中增加了PDF导入插件(Sun PDF Import Extension [Beta]) 在原始资料不存在的情况下,可以用PDF 导入插件导入并修改PDF文档。...不过PDF 导入插件仍然不支持PDF 表单。 ...
  • 基本配置在对 TinyMCE 配置的介绍中,我们将讨论基于传统表单布局中通常使用的最重要的选项,以及如何将 TinyMCE 用作内联编辑器的示例。将 TinyMCE 脚本添加到页面后,需要考虑三个配置方面:选择器配置插件配置...
  • 富头像上传编辑器是一款支持本地上传、预览、视频拍照和网络加载的flash头像编辑上传插件,可缩放、裁剪、旋转、定位和调色等... 小巧的身材:文件大小仅仅只有 50 KB,而新浪的头像编辑器组件有 58.1 KB,更有甚者...
  • Tijarah是一款数字市场虚拟资源的WordPress主题,支持WooCommerce购物插件,内置可视化页面编辑插件功能,支持RTL,采用bootstrap 4.x架构,适合视频下载站、音乐下载站、图片下载站。 主题特点: 5个首页模板 ...
  • 支持Contact form 7联系表插件和Gravity Forms表单插件 支持WPML多语言插件 支持Events manager Pro事件管理插件 支持WooCommerce购物插件 支持SEO by Yoast、 All in One Seo Pack等多种SEO插件 支持W3 Total Cache...
  • EasySNS 1.9.rar

    2019-05-23 15:21:33
    EasySNS极简社区是在ESPHP开发框架基础上开发而成的,为全新数据库...自定义表单布局路径简化;Com_contact:联系人姓名字段移出联系信息块;自定义模块:改进前端编辑;操作日志改进:现在记录缓存和清除/导出操作。
  • Laravel之Ueditor

    2017-09-30 09:21:00
    1.访问网址...2.按照插件包中的index.html样式,布局页面 3.如果需要使用表单提交,编辑,则添加制定名称的name值即可 转载于:https://www.cnblogs.com/hanivy/p/7610044.html...
  • 从开发到现在一直用的bootstrap后台。原因如下: 1.基于Bootstrap你可以快速搞出一个网站的基本布局 2....按钮、日历 、上传文件、表单元素、网格、表格、树型图、字体、编辑器等插件很丰富 归结起来就是高端大气上...
  • Joomla(囧啦) 3.9.6 英文版 更新日志:2019-05-07用户条款和隐私同意插件:添加标签和消息的布局;特色文章:页面小标题已添加;自定义表单布局路径简化;Com_contact:联系人姓名字段移出联系信息块;自定义模块:...
  • JS、JQuery、CSS+DIV实例大全

    千次下载 热门讨论 2012-07-12 14:03:21
    6.jQuery带Tips动画提示通用表单验证插件下载(jquery validate),动画效果漂亮 7.jQuery鼠标移到下载地址滑出气泡提示效果的插件 8.又一款jquery实现链接Tip演示下载 9.常用jQuery弹出式链接提示效果Tooltip...
  • 6.jQuery带Tips动画提示通用表单验证插件下载(jquery validate),动画效果漂亮 7.jQuery鼠标移到下载地址滑出气泡提示效果的插件 8.又一款jquery实现链接Tip演示下载 9.常用jQuery弹出式链接提示效果Tooltip...
  • 6.jQuery带Tips动画提示通用表单验证插件下载(jquery validate),动画效果漂亮 7.jQuery鼠标移到下载地址滑出气泡提示效果的插件 8.又一款jquery实现链接Tip演示下载 9.常用jQuery弹出式链接提示效果Tooltip...
  • Bootstrap官网教程整理

    热门讨论 2015-02-03 10:07:36
    表单布局 54 支持的表单控件 58 静态控件 63 表单控件状态 64 表单控件大小 67 表单帮助文本 69 Bootstrap 按钮 71 按钮大小 72 按钮状态 74 按钮标签 77 Bootstrap 图像 79 Bootstrap 帮助器类 80 关闭图标 80 插入...
  • 14. 分享jquery无刷新多功能表单验证插件并漂亮美化表单及错误输入提示效果 15. 简单jQuery+CSS实现验证表单红色提示效果 16. 简单表单input输入框提示插件1.0下载 17. 另种效果的jQuery EasyValidator表单验证插件...
  • 模块化后台模板

    2018-07-23 17:31:27
    原始模板为php文件格式,css...内容包含:页面基础排版(flex/column-count)布局、按钮系列组、表格系列、进度条、分页、表单、 文本编辑器、统计图表、TAB选项卡、CSS3基础动画及第三方弹层插件等常见页面使用元素。
  • wordpress-unik主题汉化

    2018-09-17 15:36:38
    Woo Commerce兼容-电商插件,可以方便的办您的网站变成在线商店 RTL支持-可以胜任从右往左读的语言 全屏布局 用户优化的简码生成 强大的管理面板 完全自适性 每个页面具有单独的设置选项 HTML5/CSS3 动画 风格管理 ...

空空如也

空空如也

1 2 3 4 5
收藏数 91
精华内容 36
关键字:

表单布局编辑插件