如何使用 Yup 验证对象数组中至少一个对象键具有真实值？答案

【问题标题】：How to validate with Yup that in array of objects at least one of object keys has true value?如何使用 Yup 验证对象数组中至少一个对象键具有真实值？
【发布时间】：2020-07-16 09:12:35
【问题描述】：

我有一个带有动态字段（答案）的表单。我正在使用 Formik 和 Yup 进行验证。一个答案是对象{text: string, is_correct: boolean}。我需要制作至少一个答案应该有 is_correct: true 的验证模式这种情况下如何进行验证？

function answersSchema (rules) {
    const {
        QUIZ_ANSWER_MAX_LENGTH,
        QUIZ_ANSWER_MIN_LENGTH,
    } = rules;
    return Yup.object().shape({
        text: Yup.string()
            .min(QUIZ_ANSWER_MIN_LENGTH, 'Too Short!')
            .max(QUIZ_ANSWER_MAX_LENGTH, 'Too Long!').required('Text of answer is required'),
        is_correct: Yup.boolean().required()
    })
}

export function setQuizSchema(rules) {
    const {
        QUIZ_QUESTION_MAX_LENGTH,
        QUIZ_QUESTION_MIN_LENGTH,
        QUIZ_DESCRIPTION_MAX_LENGTH,
        QUIZ_DESCRIPTION_MIN_LENGTH,
        QUIZ_MAX_COUNT_OF_ANSWERS,
        QUIZ_MIN_COUNT_OF_ANSWERS,
    } = rules;
    return Yup.object().shape({
        question: Yup.string()
            .min(QUIZ_QUESTION_MIN_LENGTH, 'Too Short!')
            .max(QUIZ_QUESTION_MAX_LENGTH, 'Too Long!')
            .required('Required'),
        description: Yup.string()
            .min(QUIZ_DESCRIPTION_MAX_LENGTH, 'Too Short!')
            .max(QUIZ_DESCRIPTION_MIN_LENGTH, 'Too Long!'),
        answers: Yup.array().of(answersSchema(rules))
            .min(QUIZ_MIN_COUNT_OF_ANSWERS, `The quiz should have a minimum of ${QUIZ_MIN_COUNT_OF_ANSWERS} answers`)
            .max(QUIZ_MAX_COUNT_OF_ANSWERS, `The quiz should have a maximum of ${QUIZ_MAX_COUNT_OF_ANSWERS} answers`)
    })
}

【问题讨论】：

标签： javascript reactjs validation formik yup

【解决方案1】：

您可以在 yup 架构上使用 test 方法，因此您的代码可能是这样的

...
return Yup.object().shape({
        question: Yup.string()
            .min(QUIZ_QUESTION_MIN_LENGTH, 'Too Short!')
            .max(QUIZ_QUESTION_MAX_LENGTH, 'Too Long!')
            .required('Required'),
        description: Yup.string()
            .min(QUIZ_DESCRIPTION_MAX_LENGTH, 'Too Short!')
            .max(QUIZ_DESCRIPTION_MIN_LENGTH, 'Too Long!'),
        answers: Yup.array().of(answersSchema(rules))
            .min(QUIZ_MIN_COUNT_OF_ANSWERS, `The quiz should have a minimum of ${QUIZ_MIN_COUNT_OF_ANSWERS} answers`)
            .max(QUIZ_MAX_COUNT_OF_ANSWERS, `The quiz should have a maximum of ${QUIZ_MAX_COUNT_OF_ANSWERS} answers`)
            .test('test-name', 'custom error message', answers => {
                return answers.some(answer => answer.is_correct)
             })
    })

作为旁注，最好将const 用于不会像answersSchema 函数中的变量声明那样改变的声明。

【讨论】：