어떤 컴포넌트에서든 navigation props 사용하기 - React Native

Junghyun Park·2021년 7월 15일
0

HitMeUp(Project)

목록 보기
1/3

문제

React.js와 같이 RN에서도 Navigator 하위 스크린이 아닌 경우에도, 페이지 이동을 위해 navigation을 사용할 수 있는 방법이 있을까?
실제로는 Header에 위치한 토글 컴포넌트에서 토글 컴포넌트 클릭 시, 화면 상호 전환하게 하려했지만, 토글 컴포넌트는 screen option에서 랜더링되는 컴포넌트여서 navigation을 가지지 않아 고민하게 됨

해결

https://reactnavigation.org/docs/connecting-navigation-prop/

React Native 공식 문서에 잘 나와 있었음
아래와 같은 순서로 사용하니 잘 작동 확인

import {useNavigation} from '@react-navigation/native';
...
const navigation = useNavigation();
...
navigation.navigate(moveScreenTo, {isMapMode: isMapMode});
profile
21c Carpenter

0개의 댓글