[React] Lifting State Up

이 글은 인프런 강의 소플의 처음 만난 리액트(React) 강의를 보고 정리했습니다.
https://www.inflearn.com/course/%EC%B2%98%EC%9D%8C-%EB%A7%8C%EB%82%9C-%EB%A6%AC%EC%95%A1%ED%8A%B8

하나의 데이터를 여러개의 컴포넌트에서 표현해야하는 경우가 있다

공통된 스테이트에서 사용하는 게 효율적이다 = shared state

• shared state : state에 있는 데이터를 여러 개의 하위 컴포넌트에서 공통적으로 사용하는 경우 : 하위 컴포넌트가 공통된 부모 컴포넌트의 state를 공유하여 사용하는 것
  
• 하위 컴포넌트에서 state공유하기 : 사용자로 부터 온도를 입력받아 섭씨, 화씨로 표현 : 물의 끓음 여부를 알려주는 컴포넌트 필요

  function BoilingVerdict(props) {
  	if (props.celsius >= 100) {
  		return <p>물이 끓습니다.</p>;
  }
  	return <p>물이 끓지 않습니다.</p>

  • shared state 적용하기
    : 하위 컴포넌트의 state를 공통된 부모 state로 올려서 shared state 적용하기