프론트엔드 개발자의 개발 놀이터

Bottom tabBar 안보이도록 설정하는 방법 본문

React Native

Bottom tabBar 안보이도록 설정하는 방법

프론트포텐 2024. 2. 7. 10:46
반응형
import {useIsFocused} from '@react-navigation/native';

const isFocused = useIsFocused();

useEffect(() => {
  if (isFocused) {
    // 포커싱이 되면 tabBar display none
    navigation.getParent().setOptions({tabBarStyle: {display: 'none'}});
  } else {
    // none 포커싱이 되면 바뀐 tabBarStyle을 재설정 해주어야 합니다.
    navigation.getParent().setOptions({
      tabBarStyle: {
        display: 'flex',
        backgroundColor: '#000000',
        borderTopColor: '#595653',
      },
    });
  }
}, [isFocused]);