登录 注册
当前位置:主页 > 资源下载 > 41 > 基于Vue和Element-UI的DIYPAGE自定义拖拽页面

基于Vue和Element-UI的DIYPAGE自定义拖拽页面

  • 更新:2024-10-28 16:53:02
  • 大小:2.74MB
  • 推荐:★★★★★
  • 来源:网友上传分享
  • 类别:其它 - 开发技术
  • 格式:ZIP

资源介绍

虚拟网页 做专题页面或者可视化diy页面时,牵涉到一些解决思路; 演示 视频演示(上传一个视频,可以看下动态效果) 1.页面布局 a。可以分类三栏,左侧组件栏,右侧数据编辑栏,中级,页面效果展示栏 2.动画效果 如果直接用数据驱动,动画比较僵硬,建议使用一些弹性动画效果 如果拖拽函数使用html5,拖动函数,不好用,而且拖起来有个很难看的一块,不方便自定义;建议自己改用onmouesemove / start / end来原生书写 移动时建议transform加上一个动画延迟,这样会有一些缓冲的效果,不生硬,而且动画渲染更流畅;如在拖曳元素上加上过渡时间:50ms; 3.数据存储方式 我这里是用json存储到本地存储里面,保存时再序列化到放置,每一个可以拖拽的(上下拖拽)。上下调整是改变transform:'translateY('+ wrap.originTop +'px)';原理就是