动态隐藏React导航中的标签栏

Question

我的本​​机应用程序具有以下嵌套导航结构

e.g。

这个结构的一个问题是在堆栈（聊天或任务）的内部嵌套页面中，我需要隐藏底部的tabbar。 我可以使用https://reactnavigation.org/docs/tab-navigator.html#tabbarvisible来控制可见性。

但是，这在加载时不会发生，因为隐藏是堆栈内部页面的动态活动。

在连接到redux时，我可以在tabbar组件中获取属性，但设置tabbar visiblity然后重新呈现组件。

在android中有这种常见导航模式的其他方法吗？

Answer 1

您可以通过重新排列屏幕堆栈（如版本5.x的官方文档中所示）在特定屏幕中隐藏选项卡栏 https://reactnavigation.org/docs/hiding-tabbar-in-screens/

Answer 2

我使用高度修复了它，它的效果非常好。

style: {
     height: isFullScreen ? 0 : null
}

如果你想从任何特定屏幕发送这个布尔值，你可以用 setParams 来完成

 navigation.setParams({
     isFullScreen: true      // or false
 });

然后你可以用

获取这个参数

const { isFullScreen } = route.params;

Answer 3

在要隐藏标签栏的屏幕中，使用以下代码

static navigationOptions = {
    tabBarVisible: false,
}