React - Создайте форму с предупреждением и setInterval

Question

Я пытаюсь выполнить следующее упражнение с React. Это базовое c упражнение (я учусь), но я не знаю, с чего начать, и не знаю, как проверить электронную почту и пароль. Я был бы очень признателен за помощь. Заранее благодарим!

Создайте форму, которая будет получать электронную почту и пароль, и компонент с предупреждением, изначально невидимым. При отправке он должен проверить массив пользователей, существует ли электронное письмо, и если да, правильный ли соответствующий пароль.

Если адрес электронной почты и пароль верны, вы должны отобразить положительное сообщение с зеленым фоном, в противном случае отрицательное сообщение и красный фон, но в обоих случаях серию сообщений:

This message will disappear in 3
This message will disappear in 2
This message will disappear in 1
This message will disappear in 0

и сделать предупреждение компонент снова становится невидимым, т.е. размонтировать его.

Используйте setInterval для отображения каждого сообщения в течение 1 секунды

Answer 1

Вы можете использовать состояние компонента для достижения этого.

const SomeComponent = ({}) => {
  const [email, setEmail] = '';
  const [password, setPassword] = '';
  return (
    <div>
      <input onChange={(e) => setEmail(e.target.value)} />
    </div>
  )
}

То же, что и поле пароля, и используйте setInterval для изменения состояния, а затем отображения.