react state2 State 끌어올리기 가끔 일부 컴포넌트가 동일한 변경 데이터를 보여줘야 할 필요가 있습니다. 이럴 때 공통 조상에 state를 끌어올리는 걸 권장합니다. 어떻게 하는지 살펴봅시다. 이 섹션에서는 주어진 온도에서 물의 끓음 여부를 확인하는 온도 계산기를 작성합니다. 먼저 BoilingVerdict 컴포넌트로 시작합니다. 이 컴포넌트는 prop으로 celsius 온도를 받고, 물이 충분히 끓었는 지 표시합니다. function BoilingVerdict(props) { if (props.celsius >= 100) { return The water would boil.; } return The water would not boil.; } 그리고 나서, Calculator 컴포넌트를 만듭니다. 이 컴포넌트는 온도를 입력받을 을 .. 2021. 1. 30. state와 lifecycle 이 섹션에서는 재사용가능하고 캡슐화된 Clock 컴포넌트를 만드는 방법에 대해 배우게 됩니다. 자체 타이머를 설정하고 매 초마다 스스로 업데이트합니다. function Clock(props) { return ( Hello, world! It is {props.date.toLocaleTimeString()}. ); } function tick() { ReactDOM.render( , document.getElementById('root') ); } setInterval(tick, 1000); 여기서 중요한 요구사항은 Clock이 타이머를 설정하고 매 초 UI를 업데이트 하는 것은 CLock의 구현 세부사항이어야 합니다. Clock은 한 번만 작성하고 자체적으로 업데이트 시킵니다. ReactDOM.rende.. 2021. 1. 16. 이전 1 다음