当前位置: 首页 > Web前端 > HTML5

vue-draggable

时间:2023-04-05 23:09:18 HTML5

vue-draggablegithub地址欢迎starDraggable插件可以同时使用手机和PC如何使用importDraggablefrom'./draggable'Vue.use(Draggable)第一个例子functionallowDrop(ev){ev.preventDefault()}methods:{/***当有bing.value*@bing.vaue*@event*/onDrop(index,event){document.removeEventListener('dragover',allowDrop)console.log(index,event)},onDragStart(index,event){document.addEventListener('dragover',allowDrop)console.log(index,event)}}#第二个例子functionallowDrop(ev){ev.preventDefault()}methods:{/***当没有bing.value*@event*/onDrop(event){document.removeEventListener('dragover',allowDrop)console.log(event)},onDragStart(event){document.addEventListener('dragover',allowDrop)console.log(event)}}#三个例子

functionallowDrop(ev){ev.preventDefault()}methods:{/***当没有bing.value*@event*/onDrop(event){document.removeEventListener('dragover',allowDrop)constdata=event.getData('hello')console.log(event,data)},onDragStart(event){文档.addEventListener('dragover',allowDrop)event.setData('hello')console.log(event)}}