代码拉取完成，页面将自动刷新
一款可视化编辑元素并生成html的vue操作组件
此项目参考 visual-drag-demo实现，做了较大改动，抛弃vuex依赖，改为纯vue组件状态开发，vue3+vite，组件即拿即用，移植方便可当作组件嵌入vue项目中
1.复制src/visual-drag文件夹到新项目中
2.在vue中以component形式引入src/visual-drag/index.vue或者以router形式指向src/visual-drag/index.vue文件即可
tips: 确保新项目引入element-plus
| 左侧预览区 | 画布区域 | 顶部区域 | 右侧菜单区域 |
|---|---|---|---|
| 组件拖拽调整层级顺序 | 图片组件 | 清空画布 | 图片上传修改 |
| 点击组件预览区高亮 | 文字组件 | 暗黑模式 | 属性值修改后所有组件自响应 |
| 显示组件排序号顺序 | 热区组件 | 预览 | 属性值边界值限制 |
| 锁定 | 拖拽放大缩小 | ||
| 删除 | 旋转组件 | ||
| 上移 | 网格 | ||
| 下移 | 1280x720区域 | ||
| 上左右边界限制拖拽 | |||
| 解锁/锁定(组件锁定状态无法进行任何操作) | |||
| 右键复制/粘贴 | |||
| 右键删除 | |||
| 右键置顶/置底 | |||
| 键盘事件-删除 | |||
| 键盘事件-上下左右移动 | |||
| 键盘事件-f5刷新页面给警告提示 |
| 左侧预览区 | 画布区域 | 顶部区域 | 右侧菜单区域 |
|---|---|---|---|
| 点击预览区域组件定位组件 | 画布自定义尺寸 | 操作步骤回退/前进 | 添加事件 |
| 组件吸附 | 组合 | 添加动画 | |
| 标线显示 | |||
| 下边界自动延伸 | |||
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
