React의 State, setState()

남영빈·2021년 4월 2일
0
post-thumbnail

1. State란??

State는 컴포넌트 자기 자신이 들고있는 값으며, 내부에서 변경이 가능하다.
변경을 할때는 밑에서 설명할 setState()라는 내장함수를 이용하면 된다!!!

2. 사용법 및 setState()

일단 구현하고자 하는 것은 카운트 버튼을 온클릭 할때마다
값을 증가시키거나 줄여나가는 실습입니다.

코드를 보면 Counter 컴포넌트 내부에 state를 선언하고 number에

1값을 지정해두었다. 이제 이 값을 Increase, Decrease 메서드를 통해

값을 늘이고 줄일 계획이다.

!!!! 여기서 주의 할 점은 처음 저도 이렇게 하는게 맞나 싶었지만,
this.state.number = this.state.number + 1처럼 값을 늘려주면 안된다...

setState() 메서드를 사용해서 값을 늘려야된다.

이렇게 setState()로 값을 늘려주고 버튼 이벤트 함수를 설정하기 위해
button태그에 onClick 이벤트를 넣어주었다.

여기서 onclick이 아니라 onClick을 사용한 이유는 JSX문법 때문인데

다음포스트에서 설명할 예정이다.

profile
목표치에 도달하는 개발자

0개의 댓글