el-upload 跟Form表单一起提交

vue  el-upload 上传

<el-col :span="20">
<el-form-item :label="$t('message.common.file')" prop="uploadFileList" el-upload
class="upload-demo" drag name="uploadFile'
ref="upload" list-type="text'
:auto-upload="false"
:multiple="true'
.limit="3"
:on-change="handleUploadChange"
:on-remove="handleAvatarRemove"
:on-exceed="handleExceed" >
<el-icon :size="49">color="#439eff"/>
<i-upload-filled</el-icon>
<div class="el-upload text”>将文件拖到此处，或<em>点击上传</em></div>
<div class="el-upload-tip" slot="tip">最多只能上传3个文件</div> </el-upload>
</el-form-item>
</el-co1>

vue  el-upload相关的js

setup(props, ctx){
  let form=ref({readonly: '0'})

//文件上传失败
const handleAvatarRemove=(filefileList)=>{
  console.log("handleAvatarRemove '+file)
}
//文件上传时的钩子
const handleUploadChange=(file，fileList)=>[
    console.log("handleUploadChange '+file)
    form,value.uploadfilecount = fileList.length // raw才是真实文件,给form表单
    //form.value.uploadFileList= file.raw //单个文件上传
    const exclueFileTypes = ['.exe',".sh', '.bat', .vbs',".js']
    let fileName=file.name/校验文件是否合法
    if(fileName.lastIndexOf( .)>=8)/
    let fileType=fileName.substring(fileName.lastIndexOf("."))
    if(exclueFileTypes.includes(fileType)){
        for (let index = 0; index < fileList.length; index++)         
            (if(fileList[index].name==fileName){
                  fileList.splice(index)
                  handleAvatarRemove(file,fileList)
                 ElMessage.warning(
                    fileName+'不符合文件后缀')
              return
       }
     }
    form.value.uploadFileList=[]
    if(fileList!=nu11&&fileList.length>0)
      for (let index = 0; index < fileList.length; index++) {
          form.value.uploadFileList.push(fileList[index].raw)
   } 
}
//限制数量的提示
const handleExceed =(files， fileList)=>{
ElMessage.warning(
'最多只能上传3个文件'
 )
}
return {

form,

handleAvatarRemove,

handleUploadChange,

handleExceed ,

}    
}                        

提交的时候进行转化

methods: closeLayer() fthis.layer.show = false;
submit() 
if (this.ruleForm) {

　　this.ruleForm.validate((valid) => {

　　　　if (valid) {
　　　　　　let params = this.form
　　　　　　let formdata = new FormData();
　　　　　　for(let key in params){
　　　　　　　　if(key!='uploadFilelist'&& key!='cascadensourcelist'&& key!='cascaderTargetlist'){
　　　　　　　　　　if(key=='targetplatList' && key=='sourceplatList'){
　　　　　　　　　　　　formdata.append(key，JSON.stringify(params[key]))
　　　　　　　　　　}
　　　　　　　　　　else{
　　　　　　　　　　　　formdata.append(key, params[key])
　　　　　　　　   }
　　　　　　　　}
　　　　　　}
　　　　　　if(this.form.uploadFileList!=null&this.form.uploadFileList.length>0){
　　　　　　　　for (let index = 0: index< this.form.uploadFilelist.length; index++) {
　　　　　　　　　　formdata.append('uploadFilelist，this.form.uploadFileList[index]); // 将每文件添加到FormData对象中
　　　　　　}
　　　　　}
　　　　　if (this.layer.operationType ==add'){
　　　　　　　　this.addForm(formdata)
         }
　　　　　　else {
return false;
}
})
}