如何验证非必需的yup归档

Question

我正在将yup与formik一起用于验证。我想用yup验证一个非必填字段。这里的test是非必填字段，但是当用户输入时，我们阻止他输入一些特殊字符。当用户未输入任何内容时，它也在进行验证（在用户输入内容之前，我不需要此验证）。谁能帮我，在此先谢谢

   const validationSchema = function (values) {
    return Yup.object().shape({
       test: Yup.string()
      .matches(/^[^<&>`#]+$/,'test should not contain `, &, #, <, > \n')
    })
  }

Answer 1

errors.yourFieldName和touched.yourFieldName的组合解决了您的问题：

因此，如果您输入字段的名称为test来显示/隐藏错误：

{errors.test && touched.test ? {errors.test}: 'Valid form'}

并启用/禁用您的提交按钮：

<button disabled={touched.test && (!isValid || isSubmitting)}>

我创建了一个简单的演示来在这里https://codesandbox.io/s/q8vz32mpw

进行说明。