如何使用 yup 验证检查电子邮件 ID 是否已经存在？

Question

我正在 React 应用程序中创建一个登录页面，我将电子邮件和密码提交给 api.Now 我想知道输入的电子邮件已经存在或未使用 yup 验证。

Answer 1

我很确定没有办法使用是的来检查它。但是，您可以在数据库中搜索用户输入的电子邮件。如果未找到任何内容，则该电子邮件不存在。

Answer 2

是的，有可能，下面我将展示我是如何在我的 MongoDB Atlas 上进行检查的：

checkEmail: Yup.boolean(),
email: Yup.string()
  .email("Email should be valid and contain @")
  .required("Email is required")
  .when("checkEmail", {
    is: true,
    then: Yup.string()
    .test({
      message: () => "Email already exists",
      test: async (values) => {
        if (values) {
          try {
            let response = await fetch("http://localhost:3005/users/check", {
              method: "POST",
              headers: {
                "Content-Type": "application/json",
              },
              body: JSON.stringify({ email: values }),
            });
            if (response.ok) {
              return true;
            } else {
              return false;
            }
          } catch (error) {
            console.log(error);
          }
        }
      },
    }),
    
  }),

在回调 onBlur 中的字段电子邮件中，我手动设置了 checkEmail 的值，该值在我的初始值中为 false，如下所示：

                onBlur={(e) => {
                      props.handleBlur(e);
                      if (!props.errors.email) {
                        props.setValues({
                          ...values,
                          checkEmail: true,
                         })
                        }
                      }
                    }

如何使用 yup 验证检查电子邮件 ID 是否已经存在？

How to check email id already exists or not using yup validation?

validation

reactjs

yup