Props는 properties를 줄인 말로 컴포넌트의 속성을 의미합니다. Props를 사용하면 컴포넌트를 사용할 때 임의의 값을 넣어줄 수 있습니다. 앞에서 만든 Greeting 컴포넌트에서는 ‘안녕하세요 함수 컴포넌트!’라는 고정된 텍스트를 보여줬는데요. 여기서는 Props를 사용해 ‘함수 컴포넌트’ 부분을 동적으로 바꾸는 방법을 알아보겠습니다.

Greeting 컴포넌트에 name이라는 Props를 추가하겠습니다. 컴포넌트를 다음과 같이 수정해보세요.

components/Greeting.js

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

function Greeting(props) {
  return (
    <View>
      <Text>안녕하세요 {props.name}!</Text>
    </View>
  );
}

export default Greeting;