Javascript-форум (https://javascript.ru/forum/)
-   Библиотеки/Тулкиты/Фреймворки (https://javascript.ru/forum/library-toolkit-framework/)
-   -   как сделать проверку на верность пароля и email в Formik (https://javascript.ru/forum/library-toolkit-framework/83574-kak-sdelat-proverku-na-vernost-parolya-i-email-v-formik.html)

prototip 15.01.2022 12:32

как сделать проверку на верность пароля и email в Formik
 
Добрый день. Сделал авторизацию используя graphQl, mongodb. Создал форму авторизации с помощью Formik, валидация Yup. При вводе неверного пароля падает ошибка. Где необходимо делать проверку на правильность пароля, чтобы в дальнейшем появлялась надпись что пароль или email неверный?

export function Signin() {
  const [log_in] = useLazyQuery(LOG_IN);
  const value = useContext(AuthContext);
  const history = useHistory();

  return (
    <div className="container-login">
      <div className="wrap-login">
        <Formik
          initialValues={{
            email: '',
            password: '',
          }}
          validationSchema={validateSingIn}
          onSubmit={(values, { resetForm }) => {
            log_in({
              variables: {
                email: values.email,
                password: values.password,
              },
            }).then(({ data }) => {
              value.login(data.login.token, data.login.userId);
              history.push('/');
            });
            resetForm();
          }}
        >
          <Form id="authForm" className="login-form">
            <span className="login-form-title">
              Вход
            </span>
            <label htmlFor="email">E-Mail</label>
            <Field name="email" type="email" className="input" placeholder="Email" />
            <ErrorMessage name="email" component="div" className="error-color" />

            <label htmlFor="password">Пароль:</label>
            <Field name="password" type="password" className="input" placeholder="Пароль" />
            <ErrorMessage name="password" component="div" className="error-color" />
            <button
              type="submit"
              className="login-form-btn"
            >Войти
            </button>
            <span className="not-akk">
              Нет аккаунта?<Link rel="canonical" to="/signUp" className="">Создать</Link>
            </span>
          </Form>
        </Formik>
      </div>
    </div>
  );
}


export const validateSingIn = Yup.object().shape({
  password: Yup.string().typeError('Должно быть строкой').required('Введите пароль'),
  email: Yup.string().email('Введите верный email').required('Введите Email'),
});


Часовой пояс GMT +3, время: 10:10.