더북(TheBook)

7.3.2 App 컴포넌트에서 예제 컴포넌트 사용

App.js 파일에 있던 기존 코드를 지우고, 다음 코드를 작성하세요.

App.js

import React, { Component } from 'react';
import LifeCycleSample from './LifeCycleSample';
 
// 랜덤 색상을 생성합니다.
function getRandomColor() {
  return '#' + Math.floor(Math.random() * 16777215).toString(16);
}
 
class App extends Component {
  state = {
    color: '#000000'
  }
 
  handleClick = () => {
    this.setState({
      color: getRandomColor()
    });
  }
 
  render() {
    return (
      <div>
        <button onClick={this.handleClick}>랜덤 색상</button>
        <LifeCycleSample color={this.state.color}/>
      </div>
    );
  }
}
 
export default App;

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.