Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.01.2022, 12:32
Аспирант
Отправить личное сообщение для prototip Посмотреть профиль Найти все сообщения от prototip
 
Регистрация: 15.05.2021
Сообщений: 35

как сделать проверку на верность пароля и 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'),
});
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Prompt. Как сделать проверку, чтобы строки и нечисловые значения не записывались в ма monsara Общие вопросы Javascript 2 14.06.2018 23:41
Ajax. Как сделать загрузку изображений, отображение, удаление как на Авито wowtschuk AJAX и COMET 1 07.03.2017 01:34
как сделать проверку полей на js boris2000 Элементы интерфейса 12 18.11.2014 12:15
как сделать чтобы в popup окне показывалось картинка? sarik Общие вопросы Javascript 31 15.03.2013 13:12
Как создать проверку вводимого пароля на стойкость, используя API Google. Александр Черепов Элементы интерфейса 4 03.11.2008 02:16