vue(js)滚动事件的drop作废

原创
小哥 3年前 (2022-11-10) 阅读数 10 #大杂烩

排查一个BUG:

将系统中的文件拖到目标区域drop事件侦听失败

故障排除过程:

我在当地写了一篇小文章。demo,发现可以直接写入drop这件事是不允许的,需要这样改变。????

在对应的div为这两个事件添加阻塞默认操作

@dragenter.prevent
@dragover.prevent

demo在添加了易于使用之后,在项目中进行这样的更改是不好的。这有点不舒服。因此,这个解决方案的场景与我的不同。

大多数场景都可以解决,以下是我在项目中遇到的问题以及解决这些问题的过程。!!!

尝试其他原因:

  • 怀疑dom遮挡,因为有一个功能被监控。dragenter添加了一个掩码。到面罩v-if=false如果你觉得它仍然没用,那就改变主意。
  • 由于大量的项目代码div它下面有几个组件使用拖放事件,因此首先注释掉组件引用。经过评论,发现问题仍未解决。
  • 代码版本恢复到半年前,拖放和上传很容易使用,并且其自身组件没有更改。

通过以上三点,了解到这不是自身原因,与冲突无关,所以只有最后一个需要调查的地方。
也就是说,项目文档的文件拖动封装了一个js,更多代码需要简单阅读

调查项目已打包drag.js

发现有一个错误的地方:

哎呀,为什么这里有一个window全球倾听dragover呢?
我很快就去看看用这种方法写了什么。

孩子,这个方法有一个判断执行。 dropEffect=none

给不知道dropEffect的科普下:
如果dropEffect 属性已设置none,不允许将其拖放到目标元素。 中
dropEffect详情

此方法的注释与函数函数不完全一致。注释通过取消写入。tips移动到显示器中,但有dragover不在指定el禁止拖放目标元素。天哪,如果我们下次再检查这件事 让我们看看有没有人在那里。window.addevent中加Sao运营

于是他指定el将您自己的目标元素添加到el也就是说,这属于添加一个限制,以排除我的功能并哭死。 我想这是其他原因

总结:

如果项目中有任何异常生效的事件,您可以首先查看是否有人是正确的。window听完这个事件后做Sao手术

版权声明

所有资源都来源于爬虫采集,如有侵权请联系我们,我们将立即删除