使用Yup validateSync校验事件时默认值不生效问题求助

核心问题分析 #

• 结构不匹配：输入对象层级是obj.node.node1，但原Schema定义为node1.node2，导致字段无法正确映射；
• 默认值逻辑错误：将default()放在when分支中，仅满足分支条件时才会触发，无法在字段缺失时自动填充默认值；
• 条件判断不严谨：直接判断filed3.length === 0会在字段不存在时抛出undefined错误，未覆盖字段缺失场景；
• 必填逻辑冲突：双向when依赖容易引发逻辑矛盾，未兼容"字段缺失但填充默认值"的校验场景。

修正后的代码 #

const obj = { "node": { "node1": { "field1": "value1", "field2": "value2" } } };

const validationSchema = yup.object({
  node: yup.object({
    node1: yup.object({
      field1: yup.string().required("field1为必填项"),
      // 前置默认值定义，字段缺失时自动填充
      field2: yup.string().default("my default1"),
      field3: yup.string().default("my default2"),
    })
    // 自定义校验：field2和field3至少有一个非空（含默认值填充后）
    .test(
      "at-least-one-field",
      "field2和field3至少需填写一个",
      function(value) {
        const { field2, field3 } = value;
        // 校验填充默认值后，至少有一个字段有效
        return (field2?.trim().length > 0) || (field3?.trim().length > 0);
      }
    )
    .required(),
  }).required(),
});

// 开启默认值填充与全量错误捕获
const result = validationSchema.validateSync(obj, { abortEarly: false, stripUnknown: true });
console.log(result);

关键修改说明 #

• 层级对齐：Schema结构与输入对象完全匹配，确保字段能被正确识别校验；
• 默认值前置：将default()直接绑定在字段上，校验前自动为缺失字段填充默认值；
• 自定义校验替代双向依赖：用test()方法实现"至少一个必填"的规则，逻辑更清晰，避免双向when的冲突；
• 校验参数配置：validateSync添加abortEarly: false捕获所有错误，stripUnknown: true自动清理Schema未定义的字段。

测试场景验证 #

• field2存在、field3缺失：自动填充field3默认值my default2，校验通过；
• field3存在、field2缺失：自动填充field2默认值my default1，校验通过；
• field2和field3都缺失：填充两个默认值后，因默认值非空，校验通过；
• field2和field3都为空字符串：触发"至少需填写一个"的错误提示；
• field1缺失：触发"field1为必填项"的错误提示。

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