Question

我已经定义了一个yup模式

export const ValidationSchema = yup.object().shape({
    dateTo: yup
        .date()
        .required(MandatoryFieldMessage)

   uebernachtungen: yup.array().of(
     yup.object().shape({
     ort: yup
            .string()
            .trim()
            .max(100, Maximum100CharactersMessage)
            .required(MandatoryFieldMessage),

    bis: yup
            .date()
            .required(MandatoryFieldMessage)
            .max(yup.ref("dateTo"), "display message") }))
})

我只想使用数组内的dateTo值，以使bis中的所有uebernachtungen都不允许具有大于{{1} }。

问题是我可以像dateTo那样访问数组中的项目，但不能像ort那样访问数组中的项目。

因此，在这种情况下，yup.ref（“ dateTo”）将返回undefined，但是dateTo将是正确的。似乎数组具有其自己的上下文，而我无法访问父上下文。

这怎么可能？

Answer 1

如果我正确理解了您的问题，这样的事情就可以解决...

Example of using test to get value from yup scheme

Answer 2

我遇到了类似的问题。我成功地使用了此练习。

想法：将整个表单数据作为上下文传递到架构，并使用

访问任何表单值

this.options.context

 const ValidationSchema = yup.object().shape({
     dateTo: yup
         .date()
         .required(MandatoryFieldMessage)

     uebernachtungen: yup.array().of(
         yup.object().shape({
             ort: yup
                 .string()
                 .trim()
                 .max(100, Maximum100CharactersMessage)
                 .required(MandatoryFieldMessage),

             bis: yup
                 .date()
                 .required(MandatoryFieldMessage)
                 .test('dateToCheck', 'display message', function (value) {
                    // access dateTo from passed context
                   if(value>this.options.context.dateTo) return false
                   return true }),

         })) })

传递上下文

没有Formik

在验证时发送表单数据作为上下文

 ValidationSchema.validateSync(data, {context: form_data})

使用Formik

使用 validate 代替 validationSchema

在 validateYupSchema 中将您的 Form数据作为第4个参数传递，该参数代表上下文，以后可以在模式中访问。

在 validateYupSchema 中将您的 schema 作为第二个参数传递。

    <Formik
      validate={(value) => {
        try {
          validateYupSchema(value, ValidationSchema, true, value);
        } catch (err) {
          return yupToFormErrors(err); //for rendering validation errors
        }

        return {};
      }}

       onSubmit={} />

如何在yup验证中访问数组内的父值

2 个答案: