더북(TheBook)

함수 형태로 만드는 컴포넌트는 함수 컴포넌트라고 부릅니다. 다음과 같이 코드를 작성해보세요.

components/Greeting.js

import React from 'react';
import {View, Text} from 'react-native';

function Greeting() {
  return (
    <View>
    <Text>안녕하세 함수 컴포넌트!</Text>
    </View>
  );
}

export default Greeting;

함수로 선언한 컴포넌트에서는 이와 같이 XML 형태로 이루어진 내용을 반환해줘야 합니다. 이 문법을 JSX라고 부릅니다. JSX 문법은 2.4절에서 자세히 알아보겠습니다.

최하단의 export default Greeting;App 컴포넌트에서도 작성한 것처럼 다른 파일에서 이 컴포넌트를 불러올 수 있게 해주는 코드입니다.

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