[ReactJS] setState에 대하여

튜토리얼을 보면,

jumpTo(step) {
    this.setState({
        stepNumber: step,
        xIsNext: (step % 2) ? false : true,
    });
}

jumpTo(step) {

this.setState({

stepNumber: step,

xIsNext: (step % 2) ? false : true,

});

}

이 부분이 잘 이해가 안가더라. Game 객체 내의 moves라는 React element에 onclick 이벤트로 등록된 것이 jumpTo 함수인데, jumpTo 함수가 실행되고 나면, 화면이 다시 그려지는데 그 re-rendering 시점을 못찾았었다. onRender 같은 이벤트가 존재하는것도 아니고 어떤 기준에서 다시 그려지는 건지 하고 검색 해봤더니

ReactJS는 상태가 변경(setState 함수 호출)시에 render 메소드를 다시 호출해서 re-rendering 을 진행한다.

결국 setState 는 사용자 이벤트에 따라 UI가 변경(show/hide 같은)되거나 Ajax 호출을 통해 데이터를 불러와서 다시 display 해줘야하는 등의 조건에서 사용해주면 좋을것 같다.