인프런 커뮤니티 질문&답변
작성한 질문수
tab 을 stack 에 쌓았을 때 문제
작성
·
21
0
<Stack>
<Stack.Screen name="(tabs)" options={{ headerShown: false }} />
<Stack.Screen
name="modal"
options={{ presentation: "modal", headerShown: false }}
/>
</Stack>위와 같이 작업하면 탭을 누를 때마가 스택이 쌓이는게 아닌가요? 그러면 물리 백버튼을 눌렀을 때 탭 이동이 될 것 같아서요.
카카오를 예시를 보면 탭은 스택을 쌓지 않고 있어서 탭 이동을 아무리 해도 뒤로 가기를 누르면 탭 이동을 하고 있지 않네요.
답변 2
0
0
안녕하세요, 인프런 AI 인턴입니다. 박종혁님,
React Navigation의 Stack과 Tab의 관계를 설정할 때, 탭 안에서 일부 스크린들에 대해 스택을 쌓을 때의 동작 방식에 대한 의문을 가지신 것 같습니다.
질문 핵심 요약:
- 스택 내에 탭을 정의하면 탭을 클릭할 때마다 새로운 스크린이 스택에 쌓이는 것이 아닌지 궁금하셨습니다.
- 탭 전환 시에는 스택에 스크린이 쌓이지 않아야 한다는 점에서 고민이 있으신 것 같습니다.
답변:
Tab과 Stack의 차이: 기본적으로
Tab.Navigator는 탭 사이를 전환할 때마다 새로운 인스턴스를 생성하지 않습니다. 따라서 탭 간의 전환 시 역사(history)를 쌓지 않습니다.물리 백 버튼 동작: 자연스럽게 생각할 수 있는 것은 물리적 백 버튼을 눌렀을 때, 이전 화면이나 탭으로 이동한다기보다, 현재의 탐색 히스토리를 거스르게 된다는 점입니다. React Navigation에서 물리적 백 버튼을 눌렀을 때의 동작은
BackHandler를 사용하여 원하는 방식으로 구체적으로 설정할 수 있습니다.탭 전환이 스택에 미치는 영향: 만약 사용 중인 스택 내에 탭을 구성하고 있다면, 탭 전환은 스택을 쌓지 않지만, 스택 내 다른 스크린들 (예: 모달 스크린)은 여전히 스택 형식을 따르게 됩니다.
이와 관련된 참조 글을 통해 탭과 스택의 관계, 그리고 각 구성 요소들이 어떻게 작동하는지 깊이 있게 이해할 수 있도록 돕겠습니다:
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.