vue拖拽不触发解决方式 @dragstart @drop_vue2中@drop @dragover代码不触发

作者：2023面试高手 | 2024-02-16 11:25:45

踩

vue2中@drop @dragover代码不触发

前言

最近又在撸VUE,要实现一个拖拽功能.然而发现操作下来各种不触发,醉了醉了.

解决:不触发@dragstart

//我这里使用的是iView,在对MenuItem元素添加@dragstart的时候不触发
//后来看了文档发现在对组件添加事件监听的时候需要通过添加.native来引用原始事件.
//也就是说需要使用@dragstart.native="dragstart($event)"
<MenuItem name="aaa" draggable @dragstart.native="dragstart($event,item.id)" 
></MenuItem>
1
2
3
4
5

解决:不触发@drop

//我们需要对被拖放元素添加@dragover.prevent来阻止浏览器执行与事件关联的默认动作.
<div @drop="onDrop" @dragover.prevent></div>
1
2

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/2023面试高手/article/detail/92699