vuedraggable拖拽删除实现 |
您所在的位置：网站首页 › 乐乐园儿歌 › vuedraggable拖拽删除实现 |
vuedraggable拖拽删除实现
|
vuedraggable做组件化拖拽实现了排序，但是想实现拖拽到某一个位置进行删除， 看了官方文档没有相关的demo 简单实现的demo 看了一个demo是两个vuedraggable组件可以进行拖拽移动，这个时候有了一个想法，将其vuedraggable组件隐藏 （opacity：0,z-index:9999） 起来不就可以了，拖拽开始时就把对应的delete元素展示出来，结束再隐藏起来, 关键代码 {{element.name}} delete //拖拽开始显示delete const start = (e) => { state.remove=true }; //拖拽结束隐藏delete const end = (e) => { state.remove=false }; .deleteBox { position: absolute; right: -160px; width: 100px; height: 100px; opacity: 0; z-index: 99999; } .delete { visibility: visible; height: 100px; position: absolute; width: 100px; right: -160px; background-color: red; } |
【本文地址】