3'' Ví dụ xây dựng type event form (ok)

C:\Users\Administrator\Desktop\app\src\pages\Login\index.tsx

import React, {useState} from "react";
function Login() {
  const [username, setName] = useState('');
  const [password, setPass] = useState('');
  const handleUsername = (event:React.ChangeEvent<HTMLInputElement>) => {
    var {value} = event.target;
    setName(value);
  }
  const handlePassword = (event:React.ChangeEvent<HTMLInputElement>) => {
    var {value} = event.target;
    setPass(value);
  }
  const onSubmitForm = (event:React.FormEvent<HTMLFormElement>) => {
    event.preventDefault();
  }
  return (
    <div className="container space-2 space-0--lg mt-lg-8 mt-5">
      <div className="row justify-content-lg-center align-items-lg-center">
        <div className="col-lg-5">
          <div className="bg-white shadow-sm rounded p-4 border">
            <form onSubmit={onSubmitForm}>
              <div className="mb-4 text-center">
                <h2 className="h2">Login</h2>
                <p>Lorem, ipsum dolor sit amet. &nbsp;😊</p>
              </div>
              <div className="js-form-message mb-3">
                <div className="js-focus-state input-group input-group form">
                  <input type="text" className="form-control form__input" name="username" value={username}  placeholder="Enter your username" onChange={handleUsername} />
                </div>
              </div>
              <div className="js-form-message mb-3">
                <div className="js-focus-state input-group input-group form">
                  <input type="password" className="form-control form__input" name="password" placeholder="Enter your password" onChange={handlePassword}/>
                </div>
              </div>
              <button type="submit" className="btn btn-block btn-primary">Đăng nhập</button>
            </form>
          </div>
        </div>
      </div>
    </div>
  )
}
export default Login;