ts 타입 정리

매개변수의 타입을 지정할 때  리엑트에서 기본으로 제공하는 타입을 정리합니다.

공부하면서 새롭게 보이는 타입은 지속적으로 추가할 예정입니다.

 

전체 이벤트 타입은 아래의 공식문서에 나와 있습니다.

SyntheticEvent – React

 

 

• React.FormEvent

import React, { useState } from "react";

function App() {
  const [value, setValue] = useState("");
  const onChange = (event: React.FormEvent<HTMLInputElement>) => {
    const {
      currentTarget: { value },
    } = event;
    setValue(value);
  };
  const onSubmit = (event: React.FormEvent<HTMLFormElement>) => {
    event.preventDefault();
    console.log(`Hello ${value}`);
  };
  return (
    <div>
      <form onSubmit={onSubmit}>
        <input
          value={value}
          onChange={onChange}
          type="text"
          placeholder="username"
        />
        <button>Log in</button>
      </form>
    </div>
  );
}

export default App;

•  
•