如何将Yup v0.32.11代码迁移至v1.0？附代码示例咨询

核心变更说明 #

Yup v1.0 对when方法的then/otherwise选项做了强制修改：不再支持直接传入全新的Schema实例，必须通过回调函数接收当前上下文的schema，并返回修改后的schema。

第一段代码修改 #

原代码 #

then: yup.object().shape({
  field_3: yup.string().required(content.errors.required),
}),
otherwise: yup.object().shape({
  field_1: yup.string().required(content.errors.required),
  field_2: yup.mixed().when('regulation', {
    is: regulated,
    then: yup.string().required(content.errors.required),
  }),
}),

修改后代码 #

then: (schema) => schema.shape({
  field_3: yup.string().required(content.errors.required),
}),
otherwise: (schema) => schema.shape({
  field_1: yup.string().required(content.errors.required),
  field_2: yup.mixed().when('regulation', {
    is: regulated,
    then: (schema) => schema.string().required(content.errors.required),
  }),
}),

修改要点 #

• 外层的then/otherwise改用回调函数，直接通过参数schema调用shape()扩展字段（当前schema已为object类型，无需重新调用yup.object()）
• 内层field_2的when分支也要同步修改为回调形式，保持一致性

第二段代码修改 #

原代码 #

then: yup
  .number()
  .min(0, dimensions.height.errors.atDefault)
  .max(25, dimensions.height.errors.atDefault)
  .required(content.errors.required),
otherwise: yup
  .number()
  .min(0, dimensions.height.errors.main)
  .max(25, dimensions.height.errors.main)
  .required(content.errors.required),

修改后代码 #

then: (schema) => schema
  .min(0, dimensions.height.errors.atDefault)
  .max(25, dimensions.height.errors.atDefault)
  .required(content.errors.required),
otherwise: (schema) => schema
  .min(0, dimensions.height.errors.main)
  .max(25, dimensions.height.errors.main)
  .required(content.errors.required),

修改要点 #

• 直接基于回调参数schema（当前为number类型）追加校验规则，无需重新创建yup.number()实例，继承原有schema的上下文

关键疑问解答 #

1. 原写法then: yup.object().shape({}) -> 正确修改为then: (schema) => schema.shape({})，无需额外调用schema.object()，因为当前上下文的schema已经是object类型
2. 原yup.number()开头的写法 -> 必须改为(schema) => schema.开头，v1.0强制要求分支逻辑基于当前schema修改，而非创建全新实例

内容的提问来源于stack exchange，提问作者DanielRuf-bitexpert