React 19 Приложение "События"

Space of React

требуется вход

Войдите, чтобы смотреть видео

Видеоуроки, интерактивный редактор и сохранение прогресса — бесплатно, сразу после входа.

Войти Создать аккаунт — бесплатно

Закончили урок?

Войдите, чтобы отмечать прогресс

Войти

Урок

React 19 Приложение "События" — УрокСтраница регистрации — React 19 Приложение "События" | Max Roslow | Space of React

Обработка submit формы

Обработчик отправки формы с клиентской валидацией имени, пароля и подтверждения пароля. preventDefault() нужен, чтобы форма не перезагружала страницу, а event.currentTarget подходит для FormData в TypeScript. coreui


const handleSubmit = async (event: SubmitEvent<HTMLFormElement>) => {
    event.preventDefault();
    setClientError(null);

    const form = event.currentTarget;
    const formData = new FormData(form);
    const name = String(formData.get('name') ?? '').trim()
    const email = String(formData.get('email') ?? '').trim()
    const password = String(formData.get('password') ?? '')
    const confirmPassword = String(formData.get('confirm-password') ?? '');

    if (password !== confirmPassword) {
        setClientError('Пароли не совпадают')

        return
    }

    if (password.length < 8) {
        setClientError('Пароль не должен быть короче 8 символов')

        return
    }

    if (name.length < 2) {
        setClientError('Имя не может быть меньше 2 символов')

        return
    }

    try {
        await register({ email, password, name})
    } catch  {
        
    }
}