首页 > 解决方案 > 使用 react formik 进行独特的字段验证

问题描述

我一直在尝试使用 react formik 为唯一字段实现验证逻辑。到目前为止,我已经尝试过以下方法,但不确定为什么似乎没有显示验证错误或验证逻辑不起作用......

    const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
    const uniqueNameValidation = (values) => sleep(2000).then(() => {
       let errors={};
       if (['admin', 'null', 'god'].includes(values.name)) {
          errors.description = 'Nice try';
       }
      return errors;
   });

然后在我的领域,我使用这样的功能:

    <div className="form-item">
      <Label htmlFor="Name">Name</Label>
      <Field name="name" className="form-item--name" validate={uniqueNameValidation} />
      {errors.name && touched.name && <div>{errors.name}</div>}
    </div>

任何帮助?这里也是演示链接... https://codesandbox.io/s/young-violet-12216?file=/src/AddForm.js

标签: reactjsreact-reduxformik

解决方案


推荐阅读