为何Yup将jobType值转为数组？Formik+Yup验证困惑

问题原因 #

Yup 的 .when() 方法设计上支持同时监听多个字段，当传入多个字段路径时，回调函数的第一个参数会是对应字段值组成的数组。哪怕只监听单个字段（比如这里的 $jobType），Yup 依然会保持这个行为，把单个字段值包装成数组返回，所以你看到的 selectedJobType 是数组类型，实际的 jobType 值在数组的第一个位置。

解决方案 #

你有两种方式处理这个情况：

1. 直接取数组第一个元素（适配当前写法）
   既然明确值在数组第一位，可以继续用 selectedJobType[0] 判断，注意修正代码里未定义变量的 console.log 错误：

   .when("$jobType", (selectedJobType, schema) => {
     console.log("selectedJobType:", selectedJobType, "is array:", Array.isArray(selectedJobType));
     return selectedJobType[0] === "development"
       ? schema.min(1, "At least one language is required for developers").required("Language selection is required for developers")
       : schema.notRequired();
   })
   

2. 使用 is 选项简化逻辑
   若希望回调参数直接是单个值，可以用 .when() 的对象配置写法，通过 is 指定匹配条件，代码更直观：

   languages: Yup.array()
     .of(Yup.number().required("Language selection is required"))
     .when("$jobType", {
       is: "development", // 直接匹配 jobType 的字符串值
       then: (schema) => schema
         .min(1, "At least one language is required for developers")
         .required("Language selection is required for developers"),
       otherwise: (schema) => schema.notRequired()
     }),
   

额外提示 #

你代码里 handleChange 函数的 console.log 显示值不是数组是正常的——这里拿到的是 Formik 字段更新时的原始值，而 Yup .when() 回调是内部统一处理后的格式，两者取值逻辑不同。

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