Joi validation react .custom() validation in react

Question

您好，我正在尝试使用 Joi library.Basically 向我的表单添加自定义验证，我想访问 api 和 return 错误消息或不基于数据。这是我的 Joi 模式

  const schema = Joi.object({
    email: Joi.string()
      .email({ tlds: { allow: false } })
      .required(),
    firstName: Joi.string().required(),
    lastName: Joi.string().required(),
    description: Joi.string().min(10).max(250).required().custom(isSad).message({'description.invalid':`the value provided in the description field is sad, please redact it`}),
  });

在 custom() 参数中传递的 isSad 函数

  const isSad =  (value,helpers) => {
    fetch('api url',{
      method: "POST",
      headers: {
        "apikey": "key"
      },
      body:value 
    }).then(data => {
      return data.json()
    }).then(data => {
      
      if(data.Sad > 0.49) {
        return helpers.error('description.invalid');
      }
    }).catch(error => {
      console.log('logging the error in catch', error)
    })
  }

据我所知，我将 'description.invalid' 发送到模式中的 .message() 函数，我应该在传递的对象中使用它来显示自定义消息，但出于某种原因我'我没有得到显示的错误信息。该字段似乎被验证为有效，如果收到的值 > 0.49

，在我的情况下它不应该是有效的

编辑：尝试将 schema.validateAsync 与 .external() 一起使用

  const isSad =  (value,helpers) => {
    console.log('logging value',value)
    console.log('logging helpers',helpers)

    fetch('api',{
      method: "POST",
      headers: {
        "apikey": "apikey"
      },
      body:value 
    }).then(data => {
      return data.json()
    }).then(data => {
      if(data.Sad > 0.49) { 
        throw new Error('Ur description is sad please edit it')
      }
    }).catch(error => {
      console.log('logging the error in catch', error)
    })
  }

我只是像这样附加 .external(isSad) 到模式

  const schema = Joi.object({
    email: Joi.string()
      .email({ tlds: { allow: false } })
      .required(),
    firstName: Joi.string().required(),
    lastName: Joi.string().required(),
    description: Joi.string().min(10).max(250).required().external(isSad)
});

我还必须转换我使用 schema.validateAsync 的代码，因为它现在 returns 数据作为 HTTP response.BUT 它仍然不起作用我没有得到任何回应.external() 和描述字段已验证（就像 .external() 根本不存在一样）。

Answer 1

找到一个issue，它说custom只适用于同步函数，对于异步你需要使用external。

编辑1

如果我理解正确，如果不正确请纠正我，问题是错误没有抛出，应该抛出。
在那种情况下，我做了以下事情。更改了请求和数据。
控制台显示：logging the error in catch Error: Ur description is sad please edit it。在我看来这是预期的行为。

const isSad = (value) => {
  console.log("value: ", value);

  fetch("https://api.coindesk.com/v1/bpi/currentprice.json", {
    method: "GET"
  })
    .then((data) => data.json())
    .then((data) => {
      console.log("request data: ", data);
      if (value.startsWith(data.chartName)) {
        throw new Error("Ur description is sad please edit it");
      }
    })
    .catch((error) => {
      console.log("logging the error in catch", error);
    });
};

const schema = Joi.object({
  email: Joi.string()
    .email({ tlds: { allow: false } })
    .required(),
  firstName: Joi.string().required(),
  lastName: Joi.string().required(),
  description: Joi.string().min(10).max(250).required().external(isSad)
});

schema.validateAsync({
  email: "asf@adf.asdf",
  firstName: "adfsdafsdf",
  lastName: "asdfasdf",
  description: "Bitcoin111"
});

Answer 2

我最终使用了 .validate() 而不是 .validateAsync() 并在 Joi 已经验证了表单之后进行了我自己的自定义函数检查。

Joi validation react .custom() validation in react

Joi validation react .custom() validation in react

javascript

reactjs

validation

joi