javascript - 使用 Yup 进行复选框模式验证

Question

我正在使用 Yup 来验证我的架构，它有一个数组

• 标题
• 多个复选框，其中一个必须为真。

我一直在使用 Formik，所以这是初始值

const initialValues = {
    exercises: [
        {
            title: "",
            exerciseType: {
                reps: false,
                duration: false,
                extraWeight: false,
            },
        },
    ],
};

接下来，这是我的验证模式 -

const exerciseSchema = yup.object().shape({
        exercises: yup.array().of(
            yup.object().shape({
                title: yup.string().required().min(2).label("Exercise Name"),
                exerciseType: yup
                    .object({
                        reps: yup.boolean(),
                        duration: yup.boolean(),
                    })
                    .test("validationTest", null, (exerciseType) => {
                        if (exerciseType.reps || exerciseType.duration) {
                            return true;
                        }
                        return new yup.ValidationError(
                            "Please select what you'd like to track for this exercise.",
                            exerciseType,
                            "exerciseType"
                        );
                    }),
            })
        ),
    });

虽然这会引发错误，但它会为数组中的所有复选框引发错误。理想情况下，它应该只在抛出错误之前检查每个练习类型对象。

任何有关如何解决此问题的提示将不胜感激，因为我已经坚持了几个小时了！

标签： javascriptreact-nativeformikyup