binxinxuelian 2017-11-26 04:14 采纳率: 0%
浏览 3906

多文件上传问题---前端开发

我用vue做了一个文件上传的页面,可以上传多个文件。但是有个问题,
如果上传多个文件时,只能第一个上传成功。其他的就不能上传了。找不到原因,
求大神指教。代码:




上传







  • {{item}}










export default { data(){ return { files:"", patchNames: [], patchFiles:[], patchFileInfos: [], delList:[], selectList:[], //选择的补丁列表 FTPS:[], countNum:0, patchlen:0, } //初始化data }, components:{ "LayoutDetailPage":LayoutDetailPage, }, mounted(){ }, methods: { loadPatchFile:function(){ var that=this; this.files = this.$refs.fileSelect.files; console.log("files的长度"+this.files.length); console.log("this.files"+this.files); var str = ''; var that=this; for(let i=0;i<this.files.length;i++){ let file=that.files[i]; that. patchNames.push(file.name); that.patchFiles.push(file); } }, upload:function(){ var that=this; console.log("文件名称:"+this.patchNames); console.log("上传服务器的files--"+this.patchFiles+"长度为:"+this.patchFiles.length); for(var i=0;i<this.patchFiles.length;i++){ var file=that.patchFiles[i]; that.changeBase64(file); } }, delPatch:function(){ console.log("排序前:"+this.delList); this.delList=this.delList.sort(); this.selectList=this.delList; console.log("排序前:"+this.delList); var that=this; if(this.delList.length>0){ var list=that.delList; console.log(this.delList); for(let i=list.length-1;i>=0;i--){ that.patchNames.splice(list[i],1); that.patchFiles.splice(list[i],1); $("#"+list[i]).css("background-color","#FBFBFB"); } this.delList=[]; }else{ bootbox.alert("请先选择补丁"); } }, changeBase64:function(file){ var that=this; var postData={}; if (window.File && window.FileReader && window.FileList && window.Blob) { let reader = new FileReader(); reader.onloadend = function () { // that.patchInfo = reader.result; postData.FTPS=window.FTPS; postData.PatchFileName=file.name; postData.PatchFileInfo=reader.result; teldCommon.CallServiceGateWayAsync("PatchInstall-UploadPatch", function (ret) { if (ret.state == "1") { debugger that.changeState(file.name,ret.state); } else { // NotifyError(ret.errmsg); that.changeState(file.name,ret.state); } }, {filter: JSON.stringify(postData)},true,true); }; reader.readAsDataURL(file); } }, getIndex:function(index){ var indexs=[]; $("#"+index).css("background-color","#eee"); this.delList.push(index); }, changeState:function(fileName,state){ var that=this; console.log("返回为true的文件名:"+fileName); bootbox.setDefaults("locale", "zh_CN"); for(let i=0;i<this.patchNames.length;i++){ if(that.patchNames[i]==fileName){ $("#"+i).find("i").remove(); if(state=="1"){ $("#"+i).append("<i class='fa fa-check-circle icon'></i>"); that.countNum++; that.patchlen++; if(that.patchlen==that.patchNames.length){ if(that.countNum==that.patchNames.length){ bootbox.alert("上传完成!"); }else{ bootbox.alert("未全部上传!"); } } }else{ $("#"+i).append("<i class='fa fa-exclamation-circle icon1'></i><a style='margin-left: 10px; font-size: 12px;' href='javascript:void(0)'>上传</a>"); $("#"+i).find("a").on("click",function(){ $("#"+list[i]).css("background-color","#FBFBFB"); console.log(i); that.changeBase64(that.files[i]); }); } } } }, } }
  • 写回答

1条回答

  • devmiao 2017-11-26 04:17
    关注
    评论

报告相同问题?

悬赏问题

  • ¥50 有数据,怎么建立模型求影响全要素生产率的因素
  • ¥50 有数据,怎么用matlab求全要素生产率
  • ¥15 TI的insta-spin例程
  • ¥15 完成下列问题完成下列问题
  • ¥15 C#算法问题, 不知道怎么处理这个数据的转换
  • ¥15 YoloV5 第三方库的版本对照问题
  • ¥15 请完成下列相关问题!
  • ¥15 drone 推送镜像时候 purge: true 推送完毕后没有删除对应的镜像,手动拷贝到服务器执行结果正确在样才能让指令自动执行成功删除对应镜像,如何解决?
  • ¥15 求daily translation(DT)偏差订正方法的代码
  • ¥15 js调用html页面需要隐藏某个按钮