使用 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

    ]

  },

}