[state] useState를 사용하여 state업데이트 시키기

state는 보통 동적데이터(dynamic data)와 함께 작업할때 만들어진다.

변하는 데이터, 존재하지않는 데이터, 생겨나고 사라지는 데이터...

state에 변할 데이터를 넣어주고 렌더링할땐 {this.state._______}를 해준다.

 

이제 이 데이터를 어떻게 변화를 줄것인가..

add, minus함수를 만들고 onClick에 심어준다.

콘솔로 확인하면 잘 찍혀있다.

이제 이 state를 업데이트 시켜주자

useState를 사용해준다!!

이제 Add버튼을 누르면 0이었던 count는 1이되고, minus버튼을 누르면 -1이된다.

setState를 사용하지않으면 새 state와 함께 render function이 호출되지않는다.

 

더 스마트한 방법으로는,

current.state를 사용하면 현재의 state를 가지고올수있다.

state를 set할때 외부의 상태에 의존하지않는 가장 좋은 방법!

알아두자 setState를 호출할 때마다 리액트는 새로운 state와 함께 render function호출