在特定屏幕中隱藏標簽欄 React-Native

Question

我通讀了關於這個特定問題的文檔，但我仍然不太明白。 這是我的場景：

我有一個帶有三個選項卡的BottomTabNavigator ：主頁、相機和個人資料。 使用我當前的設置，我可以在這些屏幕之間切換，並且 TabBar 會顯示在每個屏幕上。 但是我想要的是在 TabBar 上具有相同的三個選項卡項，但 TabBar 不會顯示在相機屏幕中。

如果我的理解是正確的，我所附的鏈接僅允許您從屏幕上刪除 TabBar，如果您從 TabBar 中刪除該選項卡（例如，如果我從 TabBar 中刪除相機，我只能實現我想要的，但我想保留TabBar 中的相機選項卡）。

export default function App() {
  return (
    <NavigationContainer>
      <Tab.Navigator>
        <Tab.Screen
          name="Home"
          component={HomeScreen}
        />
        <Tab.Screen
          name="Camera"
          component={CameraScreen}
        />
        <Tab.Screen
          name="Profile"
          component={ProfileScreen}
        />
      </Tab.Navigator>
    </NavigationContainer>
  );
}

我試過了：

options={{ tabBarVisable=false }}

但它也沒有用。

Answer 1

import { getFocusedRouteNameFromRoute } from '@react-navigation/native';    


const getTabBarVisibility = (route) => {    

    const routeName = getFocusedRouteNameFromRoute(route) ?? 'Home';
    const disabledScreens = ['CameraScreen'];
    
    if (disabledScreens.includes(routeName)) {
        return false;
    }
    
    return true;
};    

<Tab.Navigator 
        screenOptions={({route}) => ({            
            tabBarVisible: getTabBarVisibility(route)
        })
    >