reactjs - 为什么是的字符串验证在它是一个对象时不会抛出错误？

Question

我举了一个例子来说明发生了什么（我分叉了第一个谷歌搜索“formik example”）。

我正在使用react-select，它在状态中存储一个具有value和label属性的对象。

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

Answer 1

根据 Yup 的文档：

默认情况下，字符串的强制转换逻辑是在值存在时调用 toString。不强制空值（使用 ensure() 将空值强制为空字符串）。

换句话说，它调用toString()将是"[object Object]"（即它是一个字符串）的选择结果。您可以使用strict()（此处的文档）修复它：

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

当然，您的选择输入将无法通过验证，因此您需要将其更改为以下内容：

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