본문 바로가기
coding/react native

[React Native] 특정 스크린에서 하드웨어 뒤로가기 방지하기

by 코딩희송 2021. 9. 24.

회원가입이라던지 특정한 상황일 경우 예외적으로 하드웨어의 뒤로가기를 방지해야 할 때가 있다.
이때 사용하는 방법을 소개하려고 한다.

필요한 라이브러리:

  • react navigation v5
const routesParams = useRoute();
...
useFocusEffect(
    React.useCallback(() => {
      const onBackPress = () => {
        if (routesParams.name === '특정페이지') {
          return true;
        } else {
          return false;
        }
      };

      return () => BackHandler.removeEventListener('hardwareBackPress', onBackPress);
    }, [routesParams]),
  );

useRoute를 이용하여 현재 보고있는 스크린 네임이 '특정페이지'이면 true를 돌려주고 아니면 false를 돌려주면서
하드웨어 뒤로가기를 방지할 수 있다.

언마운트도 잊지 않도록 한다.

댓글