[강의노트] [React] useState

  1. React Hooks는 react의 state machine에 연결하는 기본적인 방법으로 class를 사용하지 않고도 함수형 컴포넌트에서 state를 관리할 수 있다.

useState는 상태를 변경하는 것으로 [변경할 만큼의 값, 변경되는 값] 2개의 value로 이뤄진 배열을 반환한다.

증가 버튼 클릭시 +1, 감소 버튼 클릭시 -1 되는 기능을 useState를 이용하여 만들어보았다.

const App = () => {
  const [item, setItem] = useState(1);
  const increament = () => setItem(item + 1);
  const decreament = () => setItem(item - 1);
  return (
    <div className="App">
      <h1>Hello {item}</h1>
      <button onClick={increament}>증가</button>
      <button onClick={decreament}>감소</button>
    </div>
  );
};
​

좋은 웹페이지 즐겨찾기