使用react-navigation在react-native中隐藏某些页面的底部标签栏

Question

我试图在某些页面中隐藏底部的标签栏，但没有成功。

我的路由器设置如下：

• 根：switchNav
  • 已登录：bottomTabNav
    • 工作：StackNav
      • 第一页：屏幕
      • 第二页：屏幕<-该页面需要隐藏
    • 收入：屏幕
  • SignedOut：StackNav
    • 登录：屏幕
    • 注册：屏幕

tabBarComponent：CustomTabs

我尝试了2种方法：

1. 简单设置tabBar在第二页上可见。不起作用

static navigationOptions = {
    tabBarVisible: false
};

or 

//Edit, forgot to add this
static navigationOptions = ({navigation}) => ({
    tabBarVisible: false
})

1. 似乎是一种骇人听闻的方式

第二页

componentDidMount(){
   this.props.navigation.setParams({visible: false});
}

CustomTabs

static getDerivedStateFromProps(props, state={}){
    console.log(props.navigation.getParam('visible', 0));
}

or using componentWillReceiveProps()

想法是尝试获取一个事件以查看是否加载了此第二页，并将设置为在该CustomTab中不可见。

我没有从getParam得到任何东西，我假设这是因为此页面位于stackNav内并且无法传递给tabNav。但是，当第二页完成加载并调用componentDidMount时，CustomTabs页面中的getDerivedStateProps确实会向其发出事件。

Answer 1

尝试使用

static navigationOptions = ({navigation}) => ({
    tabBarVisible: false
})

代替

static navigationOptions = {
    tabBarVisible: false
};

在某些情况下对我有帮助