使用抽屉+标签+堆栈

Question

我想在某些屏幕中隐藏选项卡栏，更确切地说，是在每个选项卡主屏幕之后的屏幕中。

我正在使用Reac导航5 用钩子反应本机

我有以下布局，我正在使用抽屉，标签和堆栈。

我希望当用户停在购物车选项卡上时标签栏可以正常显示，但是当用户单击将他带到购物车堆栈的另一个屏幕的按钮时，我希望不再显示标签栏可见。

也就是说，仅在选项卡的主屏幕中显示选项卡栏，而在其他屏幕中则不存在。

对于Home，此行为令人满意，但在其他选项卡中则不满意。

我非常感谢您的帮助，我收到了评论，建议以及任何可以使导航分布更加完善的内容。

Answer 1

我已经通过以下方式在我的应用中完成了此操作：

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

  { ... }

  // Hide parent tab bar on focus
  useFocusEffect(
    useCallback(() => {
      // Do something when the screen is focused
      const parent = dangerouslyGetParent();
      if (parent) {
        parent.setOptions({
          tabBarVisible: false,
        });
      }

      return () => {

      };
    }, [dangerouslyGetParent]),
  );

但是要当心。要使此功能在使用navigation.pop()或导航回上一屏幕时真正起作用，您将需要将此相同的代码添加到要确保显示标签栏的组件中，因为这会修改导航器配置本身。因此，您只需要在带有禁用代码的tabBarVisible: true

从禁用的标签栏屏幕导航到的屏幕中进行相同的操作

挖掘时，我还没有真正找到更好的研究方法。希望使用其他更优雅的解决方案，但这至少可以帮助您入门和正常工作。