文件上传校验upload---综合

1. 文件上传之前进行文件校验

 beforeUpload(file,UpFileList)
        // file：上传单个文件时候的文件内容，UpFileList：上传多个文件时的文件内容组成的数组
         // 1、控制文件数量
        if (this.fileList.length + UpFileList.length > 10) {
         this.$message.warning('超过文件上传数量限制')
          // 设置上传的文件为错误状态
         file.status = 'error'
         return false
       }
        // 2、控制上传的文件大小
       if (file.size > 1073741824) {
          this.$message.warning('文件大小超过最大限度1G')
          file.status = 'error'
          return false
       }
       // 3、控制上传文件不能为空
       if (file.size === 0) {
         this.$message.warning('所选信息中存在空文件或目录，请重新选择')
         file.status = 'error'
         return false
       }
      // 4、控制已上传文件不重复
       this.fileList.map(item=>{
         if(item.name===file.name){
           this.$message.warning('不允许重复上传')
           file.status = 'error'
           return false
         }
       })
     // 5、控制上传文件的类型 arr是上传类型的白名单
      const type = file.name.slice(file.name.lastIndexOf('.') + 1).toLowerCase()
      const arr = ['.jpg', '.png', '.jpeg']
      if (arr.includes('.' + type)) {
        return true
      } else {
        this.$message.warning(`不支持以 .${type} 扩展类型的文件或图片上传!`)
        file.status = 'error'
        return false
      }

2. 文件上传进行必填项校验

 <a-form-model  ref="chartsForm"
               :model="drawerForm"
               :rules="formValidateRules"
 >
 <a-form-model-item label="图表图片" prop="img" ref="imgRef">
 <a-upload  :action="actionUrl"
              list-type="picture-card"
              :file-list="fileList"
              :before-upload="changeFile"
               accept="image/jpeg,image/jpg,image/png"
              @preview="handlePreview"
              :remove="()=>fileList = []"
              @change="handleChange"
              :data="{ fileName: fileNames }">
 </a-upload>
 </a-form-model>

// 校验规则
 formValidateRules: {
        img: [
           { required: true, message: '请上传图表图片', trigger:  'change' }
        ]
  watch: {
    fileList: {
      handler (val) {
        if (val.length) {
          this.$refs.imgRef.clearValidate();
        }
      },
      deep: true
    }
  },
save（）{
if (from.img) {
        this.formValidateRules.img = [];
        this.$refs.imgRef.clearValidate();
      }}