(React)Hooks - useState()사용법 및 활용예제

useState

컴포넌트에서 바뀌는 값을 관리한다

useState()는 "상태 초기 값"을 전달받아 호출된다

"상태값"이 초기값으로 들어가고 , 상태값을 바꾸고싶으면 "상태 값 갱신함수"를 이용해서 변경한다

import { useState } from 'react';

const [상태 값 저장, 상태 값 갱신] = useState(상태 초기 값);

useState의 기초 Counter예제

import React, { useState } from "react";

const Counter=()=> {
  const [value,setValue] = useState(0);
  

  return (
  <>
    <h1>현재 값은 [ {value} ]입니다.</h1>
    <button onClick={()=>setValue(value-1)}>-1</button>
    <button onClick={()=>setValue(value+1)}>+1</button>
  </>
  );
}

export default Counter;

결과