useState

함수형 컴포넌트에서 상태를 관리하기 위해 사용

컴포넌트 내부에서 상태 변수를 정의하고 이를 간편하게 업데이트 할 수 있음

const [상태변수, 상태변수를 업데이트할 함수] = useState(초기값);

예시

import React, { useState } from 'react';

function Counter() {
  // count 상태 변수와 setCount 업데이트 함수를 정의
  const [count, setCount] = useState(0);

  const increment = () => {
    // setCount 함수를 사용하여 count 상태를 업데이트
    setCount(count + 1);
  };

  return (
    <div>
      <p>카운트: {count}</p>
      <button onClick={increment}>증가</button>
    </div>
  );
}

export default Counter;

• 여기에서 'setCount'를 '세터'라고도 부르며, 이후에 세터를 이용하여 count의 값을 변경할 수 있다.
• 값을 변경할 때는 초기값과 타입이 일치하도록 해야 한다.
• 객체나 배열 추가하고 싶을때는 스프레드 연산자( ... )를 이용하면 된다