elementUI一次请求上传多个文件
elementui
js
//文件上传
httpRequest(file) {
console.log(file);
},
submitUpload(file) {
this.$refs.upload.submit();
let param = new FormData();
this.fileList.forEach(file => {
param.append("files", file.raw); //此处一定是append file.raw 上传文件只需维护fileList file.raw.name要加上
param.append("fileNames", file.name);
});
//后台接口
addfile(param)
.then(res => {
if (res.code == ) {
this.experfrom.healthOffice.attachments = res.data;
console.log(this.experfrom.healthOffice.attachments);
this.$message({
message: "上传成功!",
type: "success"
});
} else {
this.$message.error(res.message);
}
})
.catch(err => {
console.log(err);
});
},
onChange(file, fileList) {
this.fileList = fileList;
},
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePreview(file) {
console.log(file);
},
handleExceed(files, fileList) {
this.$message.warning(
`当前限制选择 个文件,本次选择了 ${
files.length
} 个文件,共选择了 ${files.length + fileList.length} 个文件`
);
},
使用http-request覆盖默认的上传行为,可以自定义上传的实现 但是上传接口不要设置在里面 ,如果设置在里面会导致多个文件分开传到后台。 将上传接口放在submitUpload中,就可以实现上传多个文件调用一次接口
elementUI一次请求上传多个文件的更多相关文章
- el-upload控件一次接口请求上传多个文件
el-upload组件默认情况下上传多少个文件就会请求多少次上传接口,如何一次上传多个文件而不必多次请求上传接口呢?直接看代码 html <el-upload :action="act ...
- 利用HttpURLConnection发送post请求上传多个文件
本文要用java.net.HttpURLConnection来实现多个文件上传 1. 研究 form 表单到底封装了什么样的信息发送到servlet. 假如我参数写的内容是hello word,然后二 ...
- element-ui上传组件,通过自定义请求上传文件
记录使用element-ui上传组件,通过自定义请求上传文件需要注意的地方. <el-upload ref="uploadMutiple" :auto-upload=&quo ...
- ASP.NET Core WEB API 使用element-ui文件上传组件el-upload执行手动文件文件,并在文件上传后清空文件
前言: 从开始学习Vue到使用element-ui-admin已经有将近快两年的时间了,在之前的开发中使用element-ui上传组件el-upload都是直接使用文件选取后立即选择上传,今天刚好做了 ...
- SpringMVC实现PUT请求上传文件
在JQuery中,我们可以进行REST ful中delete和put的请求,但是在java EE标准中,默认只有在POST请求的时候,servlet 才会通过getparameter()方法取得请求体 ...
- maven工程 java 实现文件上传 SSM ajax异步请求上传
java ssm框架实现文件上传 实现:单文件上传.多文件上传(单选和多选),并且用 ajax 异步刷新,在当前界面显示上传的文件 首先springmvc的配置文件要配置上传文件解析器: <!- ...
- 如何用elementui去实现图片上传和表单提交,用axios的post方法
下面是在vue搭建的脚手架项目中的组件component文件夹下面的upload.vue文件中的内容 <!--这个组件主要用来研究upload这个elementui的上传插件组件--> & ...
- upload三种上传方式(上)---Servlet---post---commons-fileupload.1.2.1.jar方式请求上传文件
上传前进行的配置选项: 1.在下方的Servers中,右键你的tomcat--open,选中下面两个配置. 第一个:Serve modules without publishing 作用:tomcat ...
- Postman Post请求上传文件
Postman Post请求上传文件一.选择post请求方式,输入请求地址 二.填写Headers Key:Content-Type :Value:multipart/form-data 如下图 三. ...
随机推荐
- Pandas | 13 索引和选择数据
Pandas现在支持三种类型的多轴索引; 编号 索引 描述 1 .loc() 基于标签 2 .iloc() 基于整数 3 .ix() 基于标签和整数 .loc() Pandas提供了各种方法来完成基于 ...
- 异常CLRDBG_NOTIFICATION_EXCEPTION_CODE( 0x04242420)
简介 CLRDBG_NOTIFICATION_EXCEPTION_CODE,值为0x0x04242420.此异常在.CLR 4.0的启动路径期间触发,是CLR4.0版本初始化调试服务时向调试器发送消息 ...
- 安装服务器pve虚拟系统(可以通过web管理物理机集群资源与虚拟机)
做此系统前,可以先进入bios,设置一下ipmi的网络地址.可以远程管理服务器 输入服务器的ipmi里面配置的ip 默认账号与密码admin 点击launch 会自动下载认证文件 下载好java软件环 ...
- BBS项目-01
目录 BBS项目 BBS开发流程: BBS表格创建: BBS项目 BBS开发流程: BBS项目: 开发流程: 需求分析 草拟一些项目的大致技术点和流程 架构设计 架构师(框架 语言 数据库 缓存数据库 ...
- 基于Linux(中标麒麟)上QT的环境搭建
最近由于公司需要,需要在中标麒麟上进行QT的二次开发,但是网上的资料很少,就算是有也基本都是其他的版本的Linux上的搭建.中标麒麟本身的资料也很好,而且还只能试用60天. 下面就介绍下我对此环境的搭 ...
- Linux搭建简单的http文件服务器
为了让自动化脚本可以通过wget来下载安装包,需要在集群中的某个节点部署一个http文件服务器 在Ubuntu中通过apt-get install apache2 安装apache2CentOS7中通 ...
- 【技术博客】nginx服务器的https协议实现
在本学期软件工程的Alpha和Beta阶段,我们的服务器部署都是使用基础的http协议,http在网络路由间的信息转发都为明文,这对我们网站的账户密码登录来说很不安全,因此在Gamma阶段我们实现了h ...
- Spring Boot启动命令参数详解及源码分析
使用过Spring Boot,我们都知道通过java -jar可以快速启动Spring Boot项目.同时,也可以通过在执行jar -jar时传递参数来进行配置.本文带大家系统的了解一下Spring ...
- OpenSSL创建证书
使用OpenSSL创建证书.采用的OS为CentOS7. 1. 修改OpenSSL的配置文件 vim /etc/pki/tls/openssl.cnf [ CA_default ] dir = /et ...
- magic模块 :Exception Value:failed to find libmagic. Check your installation
原因 缺少安装依赖: magic 安装依赖: https://github.com/ahupp/python-magic#dependencies windows下解决方法: https://gith ...