[ React ] React-Hooks useState 알아보기

useState

useState 는 가장 기본적인 Hooks이며 함수형 컴포넌트에서도 가변적인 상태를 지닐 수 있게 해줍니다.
useState 는 함수이며 험수가 호출되면 배열을 반환합니다

• 첫번째 원소는 상태값
• 두번째 원소는 상태를 설정하는 함수 입니다

useState 에 파라미터를 넣고 호출하면 전달받은 파라미터로 값이 바뀌고 컴포넌트가 정상적으로 리렌더링 됩니다.

import React,{useState} from 'react';

const Counter = () => {
 // useState 의 초기값을 0으로 설정

 const [counter, setCounter] = useState(0);
 return (
   <div>
     <p>현제 카운터 값은{counter}</p>
     <button onClick={() => setCounter(counter + 1)}>+1</button>
     <button onClick={() => setCounter(counter - 1)}>-1</button>
   </div> 
 )
}

export default Counter;