使用 Yup 和 Formik 自动修剪空白

loa*_*ger 11 validation typescript reactjs yup formik

我正在使用在架构上定义的 Formik React Form 和 Yup 验证:

export const Contact = yup.object<IContact>().shape({
  contactName: yup
    .string()
    .trim('The contact name cannot include leading and trailing spaces')
    .strict(true)
    .min(1, 'The contact name needs to be at least 1 char')
    .max(512, 'The contact name cannot exceed 512 char')
    .required('The contact Name is required'),
});
Run Code Online (Sandbox Code Playgroud)

有没有办法让 Yup 修剪空白而不显示消息?那么在提交表单时自动修剪空格?

bas*_*rat 12

有没有办法让 Yup 修剪空白而不显示消息

不是在一次转换中。formik 使用的 yup 转换仅用于验证。您可以在传递数据之前创建一个单独的转换来使用,但它对您valueToUse = userValue.trim()自己来说更简单。