반응형
React로 프로젝트를 만들 때에 크게 두가지로 만들 수 있습니다. class와 function입니다.
class는 state와 props를 쓰고 function은 state대신 useState를 사용합니다.
오늘 다룰 것은 class의 state입니다.
state는 유동적인 데이터를 사용할때 사용합니다.
state는 초기값 설정이 필수이며, this.state = {}를 사용하여 초기값 설정을 해주어야 합니다.
여기서 주의해야할 점은 state는 직접 조작하거나 해서는 안되며 변경이 필요할 때에는 setState메소드를 이용해야합니다. 왜냐하면 React는 state가 변경될때마다 변경된 부분을 감지해서 다시 랜더링을 하는데 setState메소드를 사용하지 않고 직접 state값을 수정하면 변경을 감지하지 못하여 리랜더링을 하지 못하기 때문입니다.
오늘은 간단하게 state를 이용하여 버튼을 클릭하면 숫자가 증가하는 예제를 만들어 보겠습니다.
오늘은 react class의 state에 대해 알아보았어용 정말 쉽죠 ~?
반응형
'React' 카테고리의 다른 글
| React router (0) | 2020.09.19 |
|---|---|
| React - class의 life cycle(라이프 사이클) - componentDidmount, componentWillmount ... (0) | 2020.09.19 |
| React State(function) (0) | 2020.09.16 |
| React props(class, function) (0) | 2020.09.16 |
| React로 웹사이트 만들어보기 create-react-app (0) | 2020.09.16 |
