인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

kimhj4268님의 프로필 이미지
kimhj4268

작성한 질문수

iOS/Android 앱 개발을 위한 실전 React Native - Basic

Tab에서 선언한 컴포넌트에게 props로 전달하는법

작성

·

519

0

class HomeScreenTab extends Component {
...
<Tab.Navigator ...
...
...
...
<Tab.Screen name="홈" component={firstTab} />

위와 같이 한 클래스 내에서 Tab navigator 선언한 다음에 tab component를 만들었습니다.

그러고 나서 firstTab이라는 하위 클래스에 props로 인자를 전달해주려고 하는데 선언문 형태가 아니라 어떻게 전달할 수 있을지 궁금합니다!

답변 1

0

Wintho님의 프로필 이미지
Wintho
지식공유자

kimhj4268,

 

안녕하세요지식공유자 Wintho 입니다.

해당 질문에 답변 드립니다.

 

props 통한 데이터 전달은 부모/자식 관계가 형성되어야 합니다.

우선, HomeScreenTab firstTab 부모/자식 관계가 맞는지부터 확인을 하셔야 하고, 만일 화면간 데이터 전달이 목적이라고 하신다면 screen 정의하는 코드에서 구현할 필요는 없습니다.

화면을 정의하는 파일에서 화면 이동 이벤트를 발생시키는 컴포넌트가 있을텐데 그곳에서 자식 클래스로 넘길 데이터를 정의하시기 바랍니다.

 

e.g. A화면 -> B화면 이동

 

. A화면 정의 파일

<TouchableOpacity

            onPress={()=>{

              this.props.navigation.push('B', {

                dataA: true,

                dataB: 100,

              })

            }}

>

     <Image

        source={require('../../assets/images/sample.png')}

        style={{width: 50, height: 50}}

        esizeMode="contain"

      />

</TouchableOpacity>

 

감사합니다.

kimhj4268님의 프로필 이미지
kimhj4268

작성한 질문수

질문하기