el-upload 使用记录

            <el-form-item              
              label="报告"
              prop="unInspectedReport"
              style="width: 100%"
            >
                <el-upload
                  class="file"
                  ref="upload"            
                  :action="uploadUrl"
                  :on-remove="handleRemove"             
                  :file-list="registerForm.fileList2"
                  :auto-upload="false"
                  :on-change="changeFile2"
                >
                  <el-button size="small" type="success" >上传附件</el-button>
                  <div slot="tip" class="el-upload__tip">只能上传pdf文件，仅支持上传1份报告</div>
                </el-upload>
                <template slot="error" slot-scope="scope">
                <div class="error-message">{{ scope.error }}</div>
                </template>
            </el-form-item>
            
            
            
            
            
            
            
            
 data() {      
    const validateFile2 = (rule, value, callback) => {
      if (!this.registerForm.fileList2 || this.registerForm.fileList2?.length === 0) {       
        callback(new Error("请上传报告"))
      } else {
        callback()
      }
    };
    return {      
      uploadUrl: '文件上传到服务器地址',     
      registerForm: {
        orderId: "",
        reportNo: "", 
        configurationInfoDetailId: "",  //审核流程      
      },
      isAdd: true,
      registerRules: {
        unInspectedReport: [   
            { required: true,  trigger: 'change' ,  validator: validateFile2}         
        ],
        configurationInfoDetailId: [          
          {required: true, trigger: "blur",  message: "请选择审核流程" }
        ], 
      }
    };
  },
  
  
   methods: {  
    handleRemove(file, fileList) {     
      this.registerForm.fileList2 = fileList
      this.$refs.registerForm.validateField('unInspectedReport');
    },
    
    changeFile2(file,fileList){
      let _this = this
      if(fileList.length>1){
        fileList.splice(fileList.length-1,1)
        this.registerForm.fileList2 = fileList
        return _this.$message.error('仅支持上传1份报告')
      }
      var str = file.name.split('.')[file.name.split('.').length-1]
      if(str=='pdf'){
        var isLt2Msg = file.raw.size / 1024 / 1024 <= 20;
        if(!isLt2Msg){
          fileList.splice(fileList.length-1,1)
          this.registerForm.fileList2 = fileList
          return this.$message.error('报告不可超出20MB')
        }else{
          this.registerForm.fileList2 = fileList
        }
      }else{
        fileList.splice(fileList.length-1,1)
        this.registerForm.fileList2 = fileList
        return this.$message.error('仅支持.pdf格式的报告')     
      }          
      if(this.registerForm.fileList2 && this.registerForm.fileList2.length){
        console.log('清除校验文字')
        this.$nextTick(() => {
          this.$refs.registerForm.clearValidate('unInspectedReport') //清除校验文字
        })        
      }              
    },    
  
 }