elementUI中el-upload上传文件时附带额外参数传递

最新推荐文章于 2023-11-29 18:16:39 发布
最新推荐文章于 2023-11-29 18:16:39 发布
阅读量1.2w 收藏 7
点赞数 1
分类专栏： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/helenwei2017/article/details/103251341
版权

公司vue项目中，文件上传这块先前一直使用的单独接口，即只是单纯的上传文件接口，上传完了拿到文件的id之后再调用文件关联绑定关系的接口，上传的代码如下即可：需要上传的url地址 以及hearders中的token等等

后面因为后台人员对接口进行了优化，上传以及保存绑定关系接口合并成一个，这里就需要上传文件时附带需要传递其他参数，搜索了一下官网，有专门的:data属性来传递额外的参数。即如下的:data="paramsData"

 

H-L
关注
  • 1
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
element-ui upload 上传组件附带额外参数进行上传（表单形式，多个参数）
wangliuqi123的博客
03-13 1万+
之前一直使用upload组件单个上传文件，最近遇到需要上传表单字段，表单中有多个参数 下图是接口要求： 官网上传组件中提供了响应的功能实现，但是demo中未演示，不注意看文档参数的话，可能会不知道这个： 接受一个object来作为参数传递， 我的组件这么写： <el-upload class="upload-demo" drag ...
基于vue3 elment+ 的文件及表单参数上传，响应接受
最新发布
oMangGuoBuDing1的专栏
05-31 492
/如果是要导入 文件上传时需要重写Content-Type为 'Content-Type': 'multipart/form-data'的设置方式Authorization我就随便写一个正常时token（具体设置方式如下）formData.append("file", fileList.value[0].raw);（我这里就一个文件，就这样把文件原始值应该是类似字节二进制 附件到formData）formData.append("docId", '4314398823146323968');
el-upload上传携带参数
fannan521的博客
11-29 3731
这块的逻辑是，:data内携带的自定义的全局变量uploadObjs，uploadObjs内有两个变量，分别是ftpUsername和ftpPassword，之后在el-upload的上传标签中调用el-button中定义的点击方法@click="uploadDoc(row)",传参为这行的值，之后可以在uploadDoc方法中，进行赋值，之后el-upload通过action的url地址向后端进行调用。在element-ui的官方文档上也有标注，利用:data进行传参。
vue使用 el-upload 上传文件附加参数（前后端代码）
qq_44985699的博客
11-21 2803
el-upload上传文件附加额外参数
使用vue的upload上传文件传入其他参数
weixin_51163554的博客
04-12 1833
使用vue的upload上传文件传入其他参数 前端界面引入依赖,自取所需 <script src="${pageContext.request.contextPath}/js/jquery-3.2.1.js"></script> <script src="${pageContext.request.contextPath}/js/jquery-3.2.1.min.js"></script> <script src="${pageConte
Vue上传文件案例，文件参数和其他参数同时传递
老程的博客
08-13 8905
html <el-upload accept=".mp3" class="upload-demo" drag action="str" :http-request="handlerChange" :auto-upload="true" :before-remove="true" multiple> <i class="el-icon-upload"></i> <div class="e
vue+elementUI(el-upload)图片压缩,默认同比例压缩操作
10-14
在本文中，我们将深入探讨如何在Vue.js项目中结合Element UI的`el-upload`组件实现图片的压缩功能，特别是在用户上传大尺寸图片时，确保前端能够处理并优化图片大小，减轻服务器负担。以下是一步步实现这个功能的...
vue+axios+el-upload实现文件上传（带参数）：
01-03
备注：不要自己设置请求头类型，让浏览器自己解析，如果在main.js中配置了post参数序列化的可能会导致浏览器解析上传文件格式错误（415错误Unsupported Media Type）；请将此配置注释掉； async uploadFile(...
elemetUi 组件--el-upload实现上传Excel文件的实例
08-29
在本文中，我们详细介绍了 el-upload 的基本使用、实现上传 Excel 文件、使用 split 进行字符串截取、el-upload 的高级使用和 elemetUi 组件的其他功能。希望读者通过本文能够快速掌握 elemetUi 组件的使用。
el-select-tree:ElementUI的el-select与el-tree结合
05-07
ElementUI的el-select与el-tree结合在一起。 在线示例 用法 安装 npm install --save el-select-tree 需要element-ui 如果您的项目不使用element-ui，则需要引入一个单独的element-ui包，如下所示： import 'el-...
vue使用iview的Upload插件进行文件上传, 携带参数, 携带headers信息等
RanGe的博客
04-23 6195
最近接手了一个重构前端页面的项目, 后台只提供api接口, 需要使用前端的vue框架中的Upload进行上传文件, 并携带两个参数, 同时还需要在请求头中设置userId 查找了很多资料, 使用原生的上传也是可以的 , 只是之前没有注意到userId这事, 导致发送请求时总是报错500(internal server error) 接下来看一下如何使用Upload标签实现点击/拖拽上传 如何携带...
Vue 组件事件回调参数传递额外参数（input远程搜@select事件）
木兮兰兮
05-28 2342
默认事件绑定为：
vue 文件及描述信息一起上传_Vue上传文件：ElementUI中的upload实现
weixin_39631007的博客
12-18 406
一、上传文件实现两种实现方式：1、直接action:action="doUpload":data="pppss">将文件拖到此处，或点击上传:action，必选参数，上传的地址，String类型。data()需要使用代理转发，要不然会有跨域的问题:data，上传时附带的额外参数，object类型。用于传递其他的需要携带的参数，比如下面的sriddata(){return{,doUpload:...
vue-＜el-upload＞导入文件携带参数
qq_32994375的博客
03-09 473
http-request 自定义文件上传操作，此时不会调用success和error方法。注意如果是调用http-request时，这个地址不用填，但是action是必要参数。show-file-list 文件个数。before-upload 调用前操作。on-error 失败调用函数。http-request 方法。action 文件上传地址，el-upload标签解析。accept 接收类型。
vue 中上传文件带参数eg
wzwzwz555的博客
10-21 3324
在element ui中上传文件时，使用FormData来上传 如下 <el-upload id="importFile" class="upload-demo" :limit="1" ref="uploads" ...
vue upload上传带参数
qq_20818641的博客
02-21 1643
vue upload上传带参数
vue里面关于文件上传提交+form表单参数
qq_44552416的博客
05-06 4471
1，使用element-ui里面的el-upload组件进行文件上传，设置auto-upload为false不自动上传。后面我们通过设置请求头部通过表单的形式进行传参。 let config = { headers: { "Content-Type": "multipart/form-data" } }; 2，防止跨域我们这里需要设置 const instance ...
vue 上传文件携带其他参数
weixin_46067308的博客
09-07 1638
on-change 属性 获取选择文件。利用接口上传文件以及其他参数。上传文件时需要携带其他参数。
element upload上传组件携带参数传参（一）
热门推荐
超级婷
02-24 1万+
element upload上传踩坑
elementui中el-upload组件删除时闪动问题处理
06-01
如果在 ElementUI 中使用上传组件 `el-upload` 删除文件时出现了闪动问题，可以通过以下方法解决： 1. 设置 transition 的 name 属性 在使用上传组件时，可以在 `el-upload-list` 组件外层添加一个 `transition` ...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值