React - useState

useState - 컴포넌트의 형재 상태를 생성,보관하는 함수

1. useState 사용하기

const[state, setState] = useState(초기값);
state : 현재 상태 정보
setState : 현재 상태 정보를 변경해주고 싶을 때 사용
최초로 렌더링을 하는 동안 반환된 state는 첫번째로 전달된 인자 (initialState) 의 값과 동일.

import { useState } from "react";
function App() {
  const [time, setTime] = useState(1);
  const handleClick = () => {
    let newTime;
    if (time >= 12) {
      newTime = 1;
    } else {
      newTime = time + 1;
    }
    setTime(newTime);
  };
  return (
    <div>
      <span>현재 시각 : {time} 시</span>
      <button onClick={handleClick}>update</button>
    </div>
  );
}
export default App;