React : useState

useState는 Hook에서 가장 기본적은 Hook이며 가변 데이터 상태를 지닐 수 있게 해준다

import React, { useState } from 'react';

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

  return(
    <div>
      <p>현재 카운터 값은 <b>{value}</b></p>

      <button onClick={()=> setValue(value + 1)}>+1</button>
      <button onClick={()=> setValue(value - 1)}>-1</button>
    </div>
  );
};

export default UseState;

useState 여러번 사용하기

import React, { useState } from 'react';

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

  const inCrement = () => {
    setValue(value + 1);
  }
  const deCrement = () => {
    setValue(value - 1);
  }

  return(
    <div>
      <p>현재 카운터 값은 <b>{value}</b></p>

      <button onClick={inCrement}>+1</button>
      <button onClick={deCrement}>-1</button>
    </div>
  );
};

export default UseState;