码迷,mamicode.com
首页 > Web开发 > 详细

vue上传多个文件,附件和其他数据一起传给后台

时间:2018-12-12 14:54:01      阅读:2826      评论:0      收藏:0      [点我收藏+]

标签:his   ping   上传   param   min   sys   span   dmi   多个   

前端:

实现多图上传主要用到以下两个属性:

      

<el-form-item label="附件上传" label-width="80px">
     
<el-form-item label="附件上传" label-width="80px">
<el-upload
style="padding-left:0px"
class="upload-demo"
action="admin/zuul/lcloud-elis-rms-gwb/um/rmsAnnex/upload"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:data="{idSalesTccUserNotetice:form.idSalesTccUserNotetice }"
multiple
:auto-upload="false"
:http-request="uploadFile"
ref="upload"
:limit="5"
:on-exceed="handleExceed"
:file-list="fileList">
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
</el-form-item>
</el-form-item>
    
 
   
uploadFile(file){
this.formDate.append(‘file‘, file.file);
},
//发布
saveProject1(){
this.formDate = new FormData()
this.$refs.upload.submit();
var uid = JSON.parse(window.sessionStorage.getItem("keyLimit")).username;
this.formDate.append(‘noticeTitle‘, this.form.noticeTitle);
this.formDate.append(‘noticeType‘, this.form.noticeType);
this.formDate.append(‘isPublic‘, this.form.isPublic);
this.formDate.append(‘note‘, this.form.note);
this.formDate.append(‘idSalesTccUserNotetice‘, this.form.idSalesTccUserNotetice);
this.formDate.append(‘uid‘, uid);
let config = {
headers: {
‘Content-Type‘: ‘multipart/form-data‘
}
}
this.axios.post("admin/zuul/lcloud-elis-rms-gwb/um/userNotice/save",this.formDate,config).then(res=>{
if(res.code == ‘0‘){
if(res.object.status == 200){
this.$emit(‘close‘);
this.$emit(‘getNoticeList‘);
 
}
}

}).catch(err => {
     console.log(err)                    
     })
},
 

java后台:

   

@ResponseBody
@RequestMapping("/save")
public TResult insert (@RequestParam("file") MultipartFile[] file,@RequestParam("noticeTitle") String noticeTitle,
@RequestParam("noticeType") String noticeType,@RequestParam("isPublic") Integer isPublic,@RequestParam("note") String note,
@RequestParam("uid") String uid,HttpServletRequest request) {
TResult result = new TResult();
System.out.println(file.length);

}

vue上传多个文件,附件和其他数据一起传给后台

标签:his   ping   上传   param   min   sys   span   dmi   多个   

原文地址:https://www.cnblogs.com/jcfxl/p/10107926.html

(1)
(1)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!