使用 Yup 访问必填字段

Question

我使用带有 yup 的 react-hook-form 来验证我的表单。

我想知道模式的所有必填字段以在表单中显示一些信息（如必填字段的“*”）。我们可以用这行代码来实现：

schema.describe().fields[field].tests.findIndex(({ name }) => name === 'required'

但是，此代码不适用于条件验证。

架构示例：

const schema = yup.object().shape({

    email: yup

    .string()

    .email()

    .required(),

    isProfileRequired: yup

    .boolean(),

    profile:  yup

    .object()

    .when('isProfileRequired',{

        is: (isProfileRequired) => isProfileRequired,

        then:

            yup

            .object()

            .nullable()

            .required()

    })

})

有没有办法在表单中检索这些信息？

Answer 1

实际上没有“好的”方法来做到这一点，但这有效：function isRequired(field){     return schema.fields[field]._exclusive.required || false      }注意：schema.fields[field]._exclusive.required如果需要或未定义，则返回 true。

Answer 2

测试 exclusiveTests 而不是 _exclusive 对我有用。const isRequired = validationSchema?.fields[aField.name]?.exclusiveTests?.required || false;

Answer 3

const isFieldRequired = (validationSchema, id) =>  validationSchema    .describe()    .fields[id].tests.some(({ name }) => name === 'required')test这将检查特定字段中是否有name等于'required'. 例如：const validationSchema: AnyObject = object({  username: string().required(),  email: string().email().required(),})将产生一个看起来像这样的模式fields：{  username: {    ...    tests: [      {name: 'required', ...}, // is required    ]  },  email: {    ...    tests: [      {name: 'email', ...},      {name: 'required', ...}, // is required    ]  },}