본문 바로가기
내마음대로만들어보자/React

[복습]React 주요 개념정리 - 함수형컴포넌트 useState()

by 소농민! 2021. 9. 22.
728x90

함수형 컴포넌트에는 state가 없지만 react hook을 통해 state를 가질 수 있다.

 

1. useState() 로 state 등록 

// count에는 state 값이 , setCount는 count라는 state값을 수정하는 함수

// useState( ): () 안에 초기값을 넣어준다.
const [count, setCount] = React.useState(3);

 

2. 예제코드

 

useState()를 통해 state를 가지고 초기값을 설정해주었다!

하나 추가 버튼을 클릭을 하게되면 addNemo 함수가 실행이 되어 setCount(count+1)을 해주는걸 볼 수 있다.

setCount는 count라는 state값을 수정해주는 함수로 정의되어 있다.

 

하나 빼기 버튼도 마찬가지 원리! 

다만, 삼항연산자를 사용하여 count값이 0 이상일경우에만 -1 을 해주도록 정의되었다.