React - 시간 state에 저장하기

참고:

 

문제 상황: 웹을 사용하는 날짜를 자동으로 App.js의 state 중 day 값으로 넣고 싶다. 그리고 나는 할 줄 모른다.

날짜를 불러오기 위해 cmd로 moment를 설치한다.

 

위 변수를 console.log하면 20211218의 형태로 날짜가 찍힌다. 좀 더 정확하게 기록되도록 초까지 찍어놓자.

DaySelect 컴포넌트의 today 값이 App 컴포넌트의 day 값에 저장되도록 로직을 완성했다.

 

오류 없이 잘 작동한다. 그런데 버튼을 두 번 눌러야 state에 저장된다. 이유를 알아보니 이랬다.

 

render()를 실행하는 과정에서 props나 state 상태가 바뀌면 render()를 다시 수행하는데,

상태가 바뀌는 즉시 수행하는 것이 아니라 수행중인 render()내의 작업은 모두 마친 후에 다시 render()작업을 수행하기 때문이라고 결론 지었다.

그 근거로,

console.log에는 적용되지 않고 나오지만 크롬 개발자 모드에서 버튼을 누르고 지켜보면 한 번만 눌러도 App.js의 day값이 적용이 된 걸 확인했기 때문이다!