如何在surveyJs中使用带类型文件的验证器?

我正在尝试在我的表单上验证上传的文档,并使用测量is和typescript使用自定义验证器,但验证器是在fileupload之后调用的,我想在上传之前验证文件类型。上传不支持的文件类型且未调用验证器时,API会抛出错误。在此之前,我如何验证和显示错误?谢谢

这是我的JSON

{
        "name": "document",
        "type": "file",
        "title": {
            "zh-cn": "6. 商业登记证",
            "zh-tw": "6. 商業登記證",
            "default": "6. Business registration certificate"
        },
        "maxSize": 10485760,
        "isRequired": true,
        "description": "{   \"type\": \"url\",   \"label\": {     \"default\": \"What does it look like?\",     \"zh-cn\": \"这个文件是什么?\",     \"zh-tw\": \"這個文件是什麼?\"   },   \"value\": \"/assets/images/sample_BR.jpg\" }",
        "acceptedTypes": ".pdf, .jpg, .png",
        "requiredErrorText": {
            "zh-cn": "请上传有效的公司商业登记证",
            "zh-tw": "請上傳有效的公司商業登記證",
            "default": "Please upload valid business registration certificate"
        },
        "allowImagesPreview": false,
        "descriptionLocation": "underInput",
        "validators": [{
            "type": "expression",
            "expression": "isJpgPngOrPdfFile({document}) == true",
            "text": "Invalid file format, please upload your document in png, jpeg or pdf format."
        }]
    }

打字代码

Survey.FunctionFactory.Instance.register('isJpgPngOrPdfFile', this.isJpgPngOrPdfFile);

isJpgPngOrPdfFile(documents) {
  console.log(typeof documents + ':' + documents);
  if (documents.length < 1) return false;

  var fileValue = documents[0];
  var checkFile = function(file) {
    return (
      !file ||
      !file.name ||
      file.name.toLowerCase().endsWith('.png') ||
      file.name.toLowerCase().endsWith('.jpg') ||
      file.name.toLowerCase().endsWith('.pdf') ||
      file.name.toLowerCase().endsWith('.jpeg')
    );
  };
  if (Array.isArray(fileValue)) {
    return fileValue.every(checkFile);
  }
  return checkFile(fileValue);
}

onUploadMethod

async onFileUpload(s, options) {
if (options.files && options.files.length) {
  const file = options.files[0];
  try {
    const data: any = await this.authService.uploadFile(file.name, file, file.type);
    options.callback(
      'success',
      options.files.map((item: File) => {
        return {
          file: item,
          content: data.code
        };
      })
    );
    const aTags = document.querySelectorAll(`[href='${data.code}']`);
    if (aTags.length) {
      (aTags[0] as HTMLAnchorElement).href = data.documentUrl;
      (aTags[0] as HTMLAnchorElement).innerHTML = data.name;
      (aTags[0] as HTMLAnchorElement).target = '_blank';
    }
  } catch (e) {
   
  }
}
}

转载请注明出处:http://www.resmedchina.com/article/20230526/2072125.html