REACT NATIVE

[REACT NATIVE] Props, defaultProps

예글 2022. 10. 31. 16:01

1. Props

- Properties의 줄임말.

- 컴포넌트의 속성을 의미.

- Props를 사용하면 컴포넌트를 사용할 때 임의의 값 넣어줄 수 있음

import React from 'react';
import {SafeAreaView} from 'react-native';
import Greeting from '../components/Greeting';

const App = () => {
	return (
    	<SafeAreaView>
        	<Greeting name="Props" />
        </SafeAreaView>
      );
 };
 
 export default App;

 

2. defaultProps

- 컴포넌트에 Props를 지정하지 않았을 때 사용할 기본값 설정

 

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

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

Greeting.defaultProps = {
  name: '리액트 네이티브',
};

export default Greeting;