5.1.2 App 컴포넌트에서 예제 컴포넌트 렌더링

    App 컴포넌트에서 ValidationSample 컴포넌트를 불러와 렌더링해 보겠습니다. 그 과정에서, App 컴포넌트를 함수형 컴포넌트에서 클래스형 컴포넌트로 전환해 주세요. 우리가 추후 App 컴포넌트에서 ref를 사용할 것이기 때문에 이렇게 미리 클래스형 컴포넌트로 작성해 주겠습니다.

    App.js

    import React, { Component } from 'react';
    import ValidationSample from './ValidationSample';
     
    class App extends Component {
      render() {
        return (
          <ValidationSample/>
        );
      }
    }
     
    export default App;

     

    코드를 저장하고, 다음 결과물이 나타나는지 확인하세요.

    ▲ 그림 5-3 리액트로 간단한 검증 구현

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