当前位置:首页 > 技术分析 > 正文内容

基于vue.js拖动设计DIY

ruisui882个月前 (03-05)技术分析10

今天给大家分享一个挺有创意的小程序DIY自由设计模板。

项目概述

  • 项目分为页面、模块、组件三个部分,可同时保存多个页面,可新建页面,可自由拖动模块至页面,模块可以复制,上下移动,可设置模块字体,背景,文字,图片,连接,样式等属性。
  • src/util/module.js 所有模块JS初始文件
  • views/diy.vue 页面主框架
  • views/attr/ 模块属性设置
  • components/ 模块上左右组件
  • views/module/ 拖入模块组件

快速开始

// 克隆项目
git clone git@gitee.com:sywlgzs/mbdiy.git

// 安装依赖
npm i

// 运行项目
npm run serve

// 打包构建
npm run build

大家如果对vue自由DIY模板感兴趣,可以去看看哈。

# 预览地址
http://diy.hsycms.com/#/diy

# 仓库地址
https://gitee.com/sywlgzs/mbdiy

OK,今天就分享到这里,感谢大家的阅读!

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/2520.html

分享给朋友:

“基于vue.js拖动设计DIY” 的相关文章

GitLab-合并请求

描述合并请求可用于在您对项目进行的其他人员之间交换代码,并轻松与他们讨论更改。合并请求的步骤步骤1-在创建新的合并请求之前,GitLab中应该有一个创建的分支。您可以参考本章来创建分支-步骤2-登录到您的GitLab帐户,然后转到“ 项目”部分下的项目 -步骤3-单击“ 合并请求”选项卡,然后单击“...

迁移GIT仓库并带有历史提交记录

迁移git仓库开发在很多时候,会遇到一个问题。GIT仓库的管理,特别是仓库的迁移。我需要保留已有的历史记录,而不是重新开发,重头再来。我们可以这样做:使用--mirror模式会把本地的分支都克隆。// 先用--bare克隆裸仓库 git clone git@gitee.com:xxx/testApp...

15款测试html5响应式的在线工具

手机、平板灯手持设备的增多,网站要顺应变化,就必须要做响应式开发,响应式网站最大的特点在于可以在不同设备下呈现不同的布局,是基于html5+css3技术,目前越来越多的网站开始采用了响应式设计,而下面15款工具可以方便测试你的html5响应式效果。Responsinatorhttp://www.re...

虚幻引擎5.5现已发布 手游开发、动画制作重大改进

Epic在今天发布了虚幻引擎5.5,现可通过Epic Launcher下载。此版本在动画创作、渲染、虚拟制片、移动端游戏开发和开发人员迭代工具集等方面做出了重大改进。 官方博客:虚幻引擎5.5现已发布,在动画创作、虚拟制作和移动游戏开发方面取得了显著进步,渲染、摄像机内视觉特效和开发人员迭代等领域的...

Gemini应用在Android上广泛推出2.0闪电模式切换器

#头条精品计划# 快速导读谷歌(搜索)应用的测试频道在安卓设备的双子应用中推出了2.0闪电实验功能,现已向稳定用户开放。双子应用通过谷歌应用运行,目前推出的15.50版本中,用户可通过模型选择器体验不同选项,包括1.5专业版、1.5闪电版和2.0闪电实验版。2.0闪电实验模型提供了更快的响应速度和优...

学前端,这30个CSS选择器,你必须熟记

你学会了基本的id,class类选择器和descendant后代选择器,然后就觉得完事了吗?如果这样,你就会错过许多灵活运用CSS的机会。虽然本文提到的许多选择器都属于CSS3,并且只能在现代的浏览器中使用,但学会这些是大有好处的。什么是CSS选择器呢?每一条css样式定义由两部分组成,形式如下:[...