[노마드코더/ReactJS로 영화 웹 서비스 만들기]3.3 Planning the Movie Component

3.3 Planning the Movie Component

class App extends React.Component{
  state={ //지금의 isLoading 상태는 true
    isLoading:true 
  };
  componentDidMount(){ //component가 생성되면 호출 함수
    setTimeout(() => {// delay function (6초 후 실행)
      this.setState({isLoading : false});
    },6000);
  }
  render(){
    const{isLoading}=this.state; //isLoading앞에 this.state 매번 붙일 필요 없어짐 
    return <div>{isLoading ? "Loading...":"We are ready"}</div>; 
    // isLoading==true이면 "Loading ..." 출력
    // isLoading==false이면 "We are ready" 출력
  }

}