게으름을 위한 부지런한 게으름뱅리' 블로그

React Native 하루 기록 - Core Components 본문

IT/FrontEnd

React Native 하루 기록 - Core Components

LazismLee 2022. 12. 7. 22:50
반응형

Core Components 공식 문서 

https://reactnative.dev/docs/components-and-apis

 

Core Components and APIs · React Native

React Native provides a number of built-in Core Components ready for you to use in your app. You can find them all in the left sidebar (or menu above, if you are on a narrow screen). If you're not sure where to get started, take a look at the following cat

reactnative.dev

 

Components ? 

재사용 가능한 개별적인 여러 조각

Components 종류

1. 클래스형 컴포넌트

 - class 키워드 필요

- Component를 상속

- render() 메소드 필요

- state, lifeCycle 기능 사용가능

- 함수형보다 메모리 자원을 더 사용

class FriendList extends React.Component {
	render() {
            return (
                <View>
                    <Friend name="A" />
                    <Friend name="B" />
                    <Friend name="C" />
                </View>
            )
	}
}

2. 함수형 컴포넌트 

- state, lifeCycle 관련 기능 사용 불가 -> hook으로 해결

- 클래스형보다 메모리 자원을 덜 사용

- 컴포넌트 선언이 편함

- 공식문서 : 함수형 컴포넌트 + hook 사용을 권장

const Friend = (props) => {
	return <Text>{props.name}</Text>;
}

export default () => {
	return(
            <View>
                <Friend name="A" />
                <Friend name="B" />
                <Friend name="C" />
            </View>
    )
}

 

반응형
Comments