element upload 解決多文件上傳一次請求


在原來ul基礎上加 :http-request="uploadFile"即可,其他函數都可以用,只是請求方式自定義。

把文件放入formDate中

            <el-form-item>
                <el-upload
                class="upload-demo"
                ref="upload2"
                :auto-upload="false"
                multiple
                :limit="10"
                :on-exceed="handleExceed2"
                :before-upload="beforePd2"
                :file-list="fileList2"
                :with-credentials="true"
                :http-request="uploadFile"
                accept=".doc,.docx,.xls,.xlsx,.pdf,.ppt,.pptx">
                <el-button slot="trigger" size="small" type="primary" plain>選取文件</el-button>
                <div slot="tip" class="el-upload__tip">支持word、excel、pdf、ppt文件大小不超過50MB</div>
                </el-upload>               
 
  handleExceed2(){
    this.$message.error('超出最大上傳限制')
  },
  beforePd2(file){
    var count = 0;
    for(var i = 0;i <file.name.length;i++){
        if(file.name[i] == '.'){
        count++;
        }
    }
        if(file.size > 1024*1024*50){
        this.$message({
            type:'warning',
            message:'上傳文件最大限制50MB'
        })
        return false;
        }else if(count != 1){
        this.$message({
            type:'warning',
            message:'文件名稱不規范,包含多個"."'
        })
        return false;
        }else{
        return true;
        } 
    },
  ckSubmit(fileList){
    if(this.$refs.upload2.$children[0].fileList.length == 0){
        this.$message({
        type:'warning',
        message:'選擇文件不能為空'
        })
    }else{
        this.$refs.ckRef.validate(valid => {
            if(valid){
                this.formDate = new FormData()
                this.formDate.append('addck','1');
                this.$refs.upload2.submit();
                var ts = this;
                axios.post(this.paths.baseURL+'/hiddendanger/checkHD',
                this.formDate, 
                { headers: { 'Content-Type': 'multipart/form-data' } }
                  ).then((res)=>{
                      if(res.data.code == 2001){
                        ts.$router.push({
                            name:'Login'
                        })
                      }else{
                        ts.$message.success('檢查成功')
                        this.ckDialog = false;
                        this.findHD();
                      }
                  }).catch(function (response) {
                    console.log(response)
                         ts.$message.error('檢查異常')
                  });       
                }
            })
    }  
    },
    uploadFile(file){
      this.formDate.append('file', file.file);
      console.log(file)
    }
 
 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM