vue中element-ui中el-upload上传方式使用drag拖拽上传无效

最新推荐文章于 2024-05-11 14:30:09 发布
最新推荐文章于 2024-05-11 14:30:09 发布
阅读量1w 收藏
点赞数 15
分类专栏： elementui vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38916157/article/details/103873802
版权

我无效的原因是加了accept（接受上传的文件类型），把accept删除掉了，拖拽上传就好用了。

凡人繁星
关注
  • 15
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
专栏目录
vue-cli3.0+element-ui上传组件el-upload的使用
10-17
在本篇文章中，我们将详细探讨如何在vue-cli3.0环境中使用Element UI的上传组件el-upload。el-upload组件允许用户上传文件，并且可以进行一系列的定制和限制，以满足各种需求。 首先，`<el-upload>`组件的基本用法...
Vue + Element-ui的下拉框el-select获取额外参数详解
10-14
在Vue.js框架中，Element-ui库提供了一套丰富的UI组件，其中包括用于创建下拉框的`el-select`组件。在实际开发中，我们可能需要在用户改变选择时获取额外的信息，比如当前行的数据或者自定义的属性。本文将详细介绍...
element-ui拖拽上传及问题解决(drag的使用注意事项)
2301_76866366的博客
05-25 2266
element-ui拖拽上传及问题解决,el-upload的drag属性使用过程中宽度问题的解决.........
vue中el-upload结合vuedraggable实现图片的上传、排序、删除以及预览等功能
dekuyu blog
04-28 3360
【代码】vue中el-upload结合vuedraggable实现图片的上传、排序、删除以及预览等功能。
vue2 + element-ui + 推拽上传文件夹获取文件数据
最新发布
weixin_52489038的博客
05-11 693
vue2 + element-ui + 推拽上传文件夹获取文件数据
element el-upload上传文件的使用
敲代码无敌小奶龙的博客
03-04 611
element el-upload上传文件的使用
el-upload 文件上传组件的使用
热门推荐
stc_ljc的博客
03-04 13万+
在我们的日常开发中，上传文件是一个很普遍的需求。这时候大家使用Vue的都会想到el-upload这个组件，
毕业设计项目-个人博客。前端基于Vue，Element-UI和Vue-Element-Admin实现，后台采用SpringBoot+MybatisPlus+Rd
07-09
Vue-Element-Admin则是一个基于Vue.js和Element-UI的后台管理系统模板，它包含了一套完整的管理端页面结构和基础功能，如登录、权限控制、多语言支持等，大大简化了前端开发的工作量。在本项目中，Vue-Element-Admin...
vue2.0 使用element-ui里的upload组件实现图片预览效果方法
10-18
今天小编就为大家分享一篇vue2.0 使用element-ui里的upload组件实现图片预览效果方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
关于element-ui的upload组件的drag功能失效的原因
qq_41083105的博客
12-06 2612
element-ui的drag功能失效
4.使用vue的el-upload文件上传，拖拽功能失效
qq_46090071的博客
04-08 3952
使用vue的el-upload文件上传，拖拽功能失效 解决方案 文件拖拽上传也就是在el-upload组件上加 drag 失效的原因是加了accept（接受上传的文件类型）,把accept删掉,拖拽上传就可以了.
el-upload拖拽功能失效
呆萌小新@渊洁的博客
10-10 1585
注意vue版本和element-ui版本. 我使用了2.4+的vue2版本.使用最新的element-ui!这个说法不对:因为他只能规定你拖拽的文件格式,他区分大小写.因此拖拽相应文件,大小写均写出即可!其他功能正常,仅拖拽功能有问题.
关于el-table使用、layout简单布局和el-upload拖拽样式修改
qq_54381639的博客
07-29 3049
最近做的vue+elementUI的前端项目开发，分享下遇到了一些关于饿了么组件样式调整的问题以及最终解决方式，希望能帮得到正在眉头紧蹙的你
el-upload 拖拽上传 校验表单
m0_50809284的博客
02-29 316
在before-upload 中做校验 注意：return false 否者会另外再发起一个本地空请求。运用element的el-uplaod drag 拖拽属性实现拖拽上传。action=“” 设为空 如有会直接上传 跳过校验。
el-upload手动上传带参数和自动上传带参数
m0_61476911的博客
10-30 1万+
自动上传带参数和手动上传带参数,以及需要携带token的上传
element-UI更改样式不生效的解决方法
weixin_42630688的博客
01-19 1万+
  .el-upload-dragger { width: 300px; height: 150px; } 在组件中更改upload 组件样式没有效果，尝试加上父类，ID选择器，去掉scoped发现都不管用， 这时可以将样式写在app.vue文件样式中，如果不想影响页面中其他upload组件，可以加上带上父类...
vue修改el-upload-dragger的宽度
qq_55856928的博客
05-06 499
【代码】vue修改el-upload-dragger的宽度。
element ui ---- el-upload实现手动上传多个文件
qq_41932589的博客
06-30 4754
【代码】element ui ---- el-upload实现手动上传多个文件。
Vue中使用element-ui的el-dialog 拖动对话框
05-30
要在Vue中使用element-ui的el-dialog对话框并实现拖动功能，可以使用vue-draggable-resizable插件来实现。 1. 安装插件 使用npm或者yarn进行安装。 ``` npm install vue-draggable-resizable --save ``` 或者 ``` yarn add vue-draggable-resizable ``` 2. 引入插件 在Vue组件中引入vue-draggable-resizable插件，并注册为全局组件。 ```javascript import Vue from 'vue' import VueDraggableResizable from 'vue-draggable-resizable' import 'vue-draggable-resizable/dist/VueDraggableResizable.css' Vue.component('vue-draggable-resizable', VueDraggableResizable) ``` 3. 使用插件 在el-dialog组件中嵌套vue-draggable-resizable组件，并设置对话框的宽度和高度。 ```html <template> <div> <el-button type="primary" @click="dialogVisible = true">打开对话框</el-button> <el-dialog title="提示" :visible.sync="dialogVisible" width="30%" :before-close="handleClose"> <vue-draggable-resizable :w="dialogWidth" :h="dialogHeight"> <p>这是一个可以拖动的对话框</p> </vue-draggable-resizable> </el-dialog> </div> </template> <script> export default { data() { return { dialogVisible: false, dialogWidth: 400, dialogHeight: 300 } }, methods: { handleClose(done) { this.dialogVisible = false done() } } } </script> ``` 在这个示例中，我们将vue-draggable-resizable组件嵌套在el-dialog组件中，并设置了对话框的宽度和高度。我们还定义了一个handleClose方法来处理对话框关闭的事件。 现在你可以在Vue中使用element-ui的el-dialog对话框并实现拖动功能了。注意：vue-draggable-resizable插件的样式可能需要根据自己的需求进行调整。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 6
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值