el-upload拖拽功能失效

已于 2022-10-10 10:12:29 修改
阅读量1.7k 收藏 1
点赞数 2
分类专栏： Vue学习 文章标签： vue.js 前端 javascript
于 2022-10-10 10:11:29 首次发布
渊洁
本文链接：https://blog.csdn.net/m0_50913327/article/details/127238935
版权

文章目录

一.问题描述

其他功能正常,仅拖拽功能有问题.
在这里插入图片描述

二. 解决方案

2.1网传accept属性引起的
这个说法不对:因为他只能规定你拖拽的文件格式,他区分大小写.因此拖拽相应文件,大小写均写出即可!

2.2 巨坑
注意vue版本和element-ui版本. 我使用了2.4+的vue2版本.使用最新的element-ui!!!
我将vue版本换成最新的生产线模式就ok了!
在这里插入图片描述

最难不过坚持丶渊洁
关注
专栏目录
vue2+上传文件
weixin_45236272的博客
07-03 79
【代码】vue2+上传文件。
el-upload上传失效问题
weixin_45124380的博客
03-30 2068
el-upload <el-form-item label="证据上传" prop="evidence"> <el-upload class="avatar-uploader" ref="upload" multiple :limit="20" :file-list="fileList" :action="uploadurl + innerworkorderDetailForm.innerworkorderId+'/'+innerworkorderDetailForm.id
关于element-ui的upload组件的drag功能失效的原因
qq_41083105的博客
12-06 2739
element-ui的drag功能失效
4.使用vue的el-upload文件上传，拖拽功能失效
qq_46090071的博客
04-08 4127
使用vue的el-upload文件上传，拖拽功能失效 解决方案 文件拖拽上传也就是在el-upload组件上加 drag 失效的原因是加了accept（接受上传的文件类型）,把accept删掉,拖拽上传就可以了.
el-upload为什么拖拽不起效果，before-upload不执行
小秋的博客
01-11 1243
设置的为true,生效了，但是不知道为什么在上传文件的时候不掉取接口正常，调取接口就会上传两遍，一直找不到原因，暂时解决方法： this.$refs["upload"].clearFiles()在调取之前清一下文件，这样就调取一遍了。目前没找到更好的方法，只能先这样。经过排查是因为 auto-upload设置了false，影响到了before-upload不执行，而且http-request也不执行。在做vue后台管理这种项目大部分都会有上传文件的功能，这里用到的是elementUi。
vue中element-ui中el-upload上传方式使用drag拖拽上传无效
qq_38916157的博客
01-07 1万+
我无效的原因是加了accept（接受上传的文件类型），把accept删除掉了，拖拽上传就好用了。
Vue 3中使用Element Plus的Upload组件实现拖拽功能失效的解决方法
最新发布
Grace_yue_wr的博客
03-12 609
官网上的拖拽组件也用不了
el-upload点击没反应，m1 mac本开发用Chrome浏览器上传文件点击没反应
06-27 1万+
最近换了 mac本做前端开发，项目用的 element-ui，上传文件功能遇到了问题 可以看到用的 el-upload ，但是点击没反应 去 element-ui 官网点击 还是没反应，然后就头疼了，换之前的 windows11 的电脑测试一下，竟然管用这时候应该就能确定问题在哪里了： mac 系统的锅，应该是 input type=file 没有权限的原因系统便好设置 - 安全性与隐私 - 完全磁盘访问权限 - 解锁 - 把浏览器选项钩上就好了 网上说的，mac 12.4 版本弄上去的(手里没有以前
＜el-upload＞组件拖曳无法上传问题
qq_30409135的博客
04-02 1248
在使用上传组件时发现拖曳上传无反应 经过排查发现 加上这句无法使用拖曳上传 accept=".csv,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" 如果要限制上传文件格式需要在 :before-upload=“beforeUpload” 中校验 ...
el-upload存在的问题
imkaifan的博客
04-01 350
按照el-upload的要求进行上传，比如说你上传了9张照片，那么其实是，每次上传一张，上传了9次 如果不想这样就只能自定义上传方式，但是呢，这个时候上传前的钩子其实是不起作用的before-upload这个钩子不起作用，就只能利用on-change这个钩子进行组装数组，牺牲性能，一起选择9次图片，其实是循环了45次 ...
vue2.0 element-ui中el-upload的before-upload方法返回false时submit()不生效解决方法
热门推荐
sunday_tutu的博客
08-24 2万+
我要实现的功能是在上传文件之前校验是否表格中存在重复的数据，有的话，需要弹窗提示是否覆盖，确认之后继续上传，取消之后，就不再上传。 项目中用的element-ui是V1.4.3 &lt;el-upload class="upload-demo" drag ref="fileUpload" :action="urls.fileUpload" :on-su...
Element-ui文件上传错误401
milijiangjun的博客
08-19 3557
今天做上传配置好后发现出现了错误 错误信息401 问题根源是跨域造成的 官网： https://element.eleme.cn/#/zh-CN/component/upload 解决办法：element ui 设置headers 代码如下： <template> <div class="mod-home"> 12332 <el-upload class="upload-demo" action="http://
minio springboot 实现大文件的分片上传、断点续传、秒传的功能
weixin_44359036的博客
08-25 1万+
本文将分享下本人做大文件上传的一些思路，以及相关代码的实现。至于minio的搭建，还是比较简单的。本文就不再赘述。本文搭建的🌰例子也仅仅是把主要流程走通，相关的demo代码可能会有bug。有不同思路的大佬也可以在评区分享下，开拓下思路。其实主要需要实现的就是分片上传。断点续传，秒传仅仅是在分片上传的基础上增加的逻辑扩张。...
el-dialog拖拽实现及拖拽过程部分区域无法拖拽，全屏情况位置不对的问题及解决方法（通用版本）
weixin_44295184的博客
10-10 1632
el-dialog拖拽实现及拖拽过程部分区域无法拖拽，全屏情况位置不对的问题及解决方法（通用版本）
ElementUI图片在Dialog中上传不回显问题
Macao7_W的博客
09-29 1541
ElementUI图片在Dialog中上传不回显问题
element-ui拖拽上传及问题解决(drag的使用注意事项)
2301_76866366的博客
05-25 2462
element-ui拖拽上传及问题解决,el-upload的drag属性使用过程中宽度问题的解决.........
element ＜el-upload＞ 组件上传细节（可拖拽）
weixin_48870945的博客
03-31 596
组件配置代码 请求头 以及 接口链接 action 配置 直接请求，默认参数名为：file
解决element-ui中组件【el-upload】一次性上传多张图片的问题
橙系圆的博客
01-22 1万+
element-ui 中的组件 el-upload默认的行为是一张图片请求一次，在项目需求中，通常是多张图片要求只向后台请求一次，下面的做法就是为了实现这样的需求 前端 <el-upload ref="upload" :action="actionUrl" :auto-upload="false" list-type="picture-card" :http-request="uploadFile" :on-preview="handlePictureCardPreview" acc
element上传文件对格式限制的处理
欢迎来到我的博客！在这里，我将分享我在前端开发方面的知识和经验。让我们一起探索前端开发的无限可能！
07-11 6876
需求：上传的文件格式必须是pdf格式，方便查看。
el-upload拖拽上传不走before-upload
09-07
你好！关于el-upload的拖拽上传不走before-upload方法的问题，可能有几种原因导致。首先，确保你已经正确地设置了before-upload属性并指定了对应的方法。其次，检查一下你的代码是否正确，特别是before-upload方法的实现部分。 如果你确认这些方面都没有问题，那么可能是el-upload组件版本的问题。请确保你使用的是最新版本的el-upload组件，并查看它的文档，了解是否有相关的更新或者已知问题。 另外，你还可以尝试在el-upload组件上添加@dragover和@drop事件监听器，并在这些事件的处理方法中手动调用before-upload方法来实现拖拽上传前的逻辑。 希望能帮到你！如果还有其他问题，请随时提问。
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

最难不过坚持丶渊洁

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值