javascript - 如何在一个测试使用异步等待的同一个 yup 字段上执行两个测试

Question

验证适用于 required 和 imageHeight，但不适用于 fileFormat。我正在使用异步等待来等待图像加载并返回确切的高度。

支持的格式数组

const SUPPORTED_FORMATS = [
  "image/jpg",
  "image/jpeg",
  "image/png",
];

获取图像高度的函数

const getImageHeight = (value) => {
  return new Promise((resolve, reject) => {
    let img = new Image();
    img.onload = () => resolve(img.height);
    img.onerror = reject;
    img.src = value?.data || value;
  });
};

是的验证

export const ImageValidate = Yup.object({
  image: Yup.mixed()
    .required("Please select image")
    .test("fileFormat", "Unsupported Format", (value) => {
      return SUPPORTED_FORMATS.some((type) =>
         type === value?.file?.type
      );
    })
    .test(
      "imageHeight",
      "image height should be >=100",
      async (value) => {
        if (value) {
          const dimension = await getImageHeight(value);
          if (dimension.height >=100) {
            return true;
          }
          return false;
        }
        return false;
      }
    ),
});

标签： javascriptreactjsyup