문제를 해결하는 데 도움이 필요합니다.

import * as React from "react";
import { useState } from "react";
import InputField from "./InputField";

interface User {
  username: string;
  password: string;
}

const Login: React.FC = () => {
  // account state
  const [account, setAccount] = useState<User>({
    username: "",
    password: "",
  });

  function handleChange(evt: React.FormEvent<HTMLInputElement>) {
    // extract name and value property of current input element
    const { name, value } = evt.currentTarget;
    const accountCopy = { ...account }; // make copy of current account;
    accountCopy[name] = value; // update value from input element value
    setAccount(accountCopy);
  }

  function handleSubmit(evt: React.FormEvent<HTMLFormElement>) {
    evt.preventDefault();
    alert(`Hi ${account.username} with pass ${account.password}`);
  }

  return (
    <div className="col-8 m-auto mt-4 py-2">
      <h1>Login</h1>
      <form onSubmit={handleSubmit}>
        <InputField
          label="Username"
          name="username"
          type="text"
          value={account.username}
          onChange={handleChange}
        />
        <InputField
          label="Password"
          name="password"
          type="password"
          value={account.password}
          onChange={handleChange}
        />
        <button type="submit" className="btn btn-primary">
          Login
        </button>
      </form>
    </div>
  );
};

export default Login;

import * as React from "react";

interface Props {
  name: string;
  label: string;
  value: string;
  type: string;
  onChange: (evt: React.FormEvent<HTMLInputElement>) => void;
}

const InputField: React.FC<Props> = ({
  name,
  label,
  value,
  type,
  onChange,
}) => {
  return (
    <div className="form-group">
      <label htmlFor="name">{label}</label>
      <input
        name={name}
        id={name}
        type={type}
        className="form-control"
        value={value}
        onChange={(evt) => onChange(evt)}
        required
      />
    </div>
  );
};

export default InputField;