함수 형태로 만드는 컴포넌트는 함수 컴포넌트라고 부릅니다. 다음과 같이 코드를 작성해보세요.
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 컴포넌트에서도 작성한 것처럼 다른 파일에서 이 컴포넌트를 불러올 수 있게 해주는 코드입니다.