如何根据Yup对象验证中的数组元素使输入字段为必填字段?

时间:2019-07-05 07:22:33

标签: reactjs validation formik yup

import * as Yup from 'yup';

const jobInfoSchema = Yup.object({
    employmentTypeSelectedArray: Yup.array()
        .min(1, 'select employment type')
        .of(
            Yup.object({
                id: Yup.number(),
                name: Yup.string(),
            })
        ),
    salaryExpected: Yup.number().when('employmentTypeSelectedArray', {
        is: employmentTypeSelectedArray => {
            employmentTypeSelectedArray.some(element => {
                return element.name == 'Permanent';
            });
        },
        then: Yup.number()
            .typeError('expected salary must be a number')
            .required('required'),
        otherwise: Yup.number().typeError('expected salary must be a number'),
    }),

});

export default jobInfoSchema;

当employeeTypeSelectedArray包含名称为“ Permanent”的对象时,我想使salaryExpected字段为必填字段。通过onclick事件,动态地将{{id“:1,” name“:” Permanent“}添加到reactjs中的jobTypeSelectedArray中,但是在提交时,薪水期望字段未显示为必填字段,而在输入字符串时则显示数字typeError。

0 个答案:

没有答案