如何访问Yup对象的父级属性？Formik表单条件验证问题

要实现「除非name.isNameUnknown为true，否则idNumber.number和idNumber.label为必填」的验证规则，你可以通过以下两种方式正确访问isNameUnknown的值：

方式一：使用根路径字符串+when配置对象 #

直接在number和label字段上通过完整根路径指定依赖，配合when的配置对象写法：

const validationSchema = Yup.object({
  name: Yup.object({
    first: Yup.string(),
    last: Yup.string(),
    isNameUnknown: Yup.boolean()
  }),
  idNumber: Yup.object({
    number: Yup.number().when("name.isNameUnknown", {
      is: false, // 当isNameUnknown为false时
      then: (schema) => schema.required("ID号码为必填项"),
      otherwise: (schema) => schema.optional()
    }),
    label: Yup.string().when("name.isNameUnknown", {
      is: false,
      then: (schema) => schema.required("标签为必填项"),
      otherwise: (schema) => schema.optional()
    })
  })
});

方式二：使用函数依赖访问根对象 #

通过when的函数参数获取表单根对象，直接读取isNameUnknown，这种写法更直观，避免路径解析问题：

const validationSchema = Yup.object({
  name: Yup.object({
    first: Yup.string(),
    last: Yup.string(),
    isNameUnknown: Yup.boolean()
  }),
  idNumber: Yup.object({
    number: Yup.number().when(
      (_, context) => context.root.name.isNameUnknown,
      {
        is: false,
        then: (schema) => schema.required("ID号码为必填项"),
        otherwise: (schema) => schema.optional()
      }
    ),
    label: Yup.string().when(
      (_, context) => context.root.name.isNameUnknown,
      {
        is: false,
        then: (schema) => schema.required("标签为必填项"),
        otherwise: (schema) => schema.optional()
      }
    )
  })
});

为什么之前的写法会得到undefined #

你之前在idNumber对象上调用.when("name.isNameUnknown")时，Yup会以idNumber作为当前上下文查找路径，而idNumber内部并没有name.isNameUnknown这个字段，所以会返回undefined。正确的做法是在需要验证的子字段（number/label）上设置when，并确保依赖路径指向根对象的name.isNameUnknown，或者通过context.root直接访问根表单对象。

内容的提问来源于stack exchange，提问作者Alextpedro