[React] State 정의하기 (class를 사용하는 경우)

State

화면에서 바뀌는 부분을 State라고 한다.

class 안에 state = {};로 정의해주고, 중괄호 안에 바뀌는 부분들을 넣는다.

state는 setState로 우리가 수동으로 변경해줄 값만 넣어야 한다. 자동적으로 바뀌는 값 X

 

 

예시 (구구단 게임)

input창에 답을 입력하고 입력버튼을 누른다. 정답이면 문제가 바뀐다.

오답이면 문제가 바뀌지 않는다.

state로 지정할 부분은 첫번째 숫자, 두번째 숫자, input창, 결과글씨이다.

 

class GuGuDan extends React.Component {
                state = {
                    first: Math.ceil(Math.random() * 9), 
                    second: Math.ceil(Math.random() * 9),
                    value: '',
                    result: ''
                };
}

 

이렇게 바뀌는 부분을 class 안에 state로 정의해주면 된다.