一款基于 Vue 的 H5 可视化编辑器(vue开发可视化编辑器)
简介:
h5ve-design是一款专注低代码平台工具,功能强大,高可扩展的HTML5可视化编辑器,致力于提供一套简单易用、高效创新、无限可能的解决方案。技术栈采用vue和javascript开发, 专注研发创新工具。
h5ve-design
技术栈:
Vue2.x Javascript Element-ui
项目结构:
代码结构
功能特点:
H5可视化编辑器包括的核心功能区有:组件区、画布区、顶部功能区
组件区
组件主要包括 常用组件, 媒体组件, 高级组件, 图表组件, 当然用户可以基于自身业务划分不同的分类, 组件规范,并进行组件的二次开发。
同时还提供了组件定制的能力, 让用户选择自己常用的组件, 这样用户可以更高效的搭建页面。
画布区
画布区可以动态调整画布大小来试试预览不同尺寸的样式, 也可以移动画布, 缩放画布来快捷的操作页面,以及刻度尺、辅助线、右键等功能。
顶部功能区
顶部功能区包括的功能有:缩放、导出、预览、保存、全屏、退出等。
应用场景:
低代码/无代码可视化设计工具、数据大屏工具、多媒体信息发布设计工具、H5设计工具、表单收集制作工具、活动页面制作工具、企业/个人微官网设计工具、宣传营销制作工具等
规划:
– 页面管理(复制,编辑, 删除, 新建)
– 组件动画
– 组件交互
– 撤销、重做
– 快捷键
– 模版库
– 微信分享
– h5ve-design Vue3版本
– h5ve-design Electron版本
演示地址:
http://h5ve.gitee.io/h5ve-design/
开源地址:
Gitee:
https://gitee.com/h5ve/h5ve-design
Github:
https://github.com/h5ve/h5ve-design