为什么 Yup 字符串验证在它是一个对象时不会抛出错误?

Why Yup string validation doesn't throw error when it's an object?

我做了一个 example 来展示发生了什么(我分叉了 "formik example" 的第一个 google 搜索)。

我正在使用 react-select,它在状态中存储了一个具有 valuelabel 属性的对象。

我正在使用 Yup.string().required() 验证 Formik 表单,但它没有显示任何错误。为什么它不显示任何错误?这是故意的还是错误?如何解决这个问题?

根据 Yup 的文档:

By default, the cast logic of string is to call toString on the value if it exists. empty values are not coerced (use ensure() to coerce empty values to empty strings).

换句话说,它在 select 结果上调用 toString(),结果将是 "[object Object]"(即它是一个字符串)。您可以使用 strict() (documentation here):

修复它
validationSchema={Yup.object().shape({
  select: Yup.string()
    .strict(true)
    .required(" select Required")
})}

当然,您的 select 输入将无法通过验证,因此您需要将其更改为如下内容:

<Select
  options={options}
  value={options.find(({ label }) => label === values.select)}
  onChange={value => setFieldValue("select", value.label)}
  onBlur={() => setFieldTouched("select")}
/>