参考:

​​https://www.jianshu.com/p/97cafea3ca38?utm_source=desktop&utm_medium=timeline​​

 

const RecordStack = createStackNavigator({
  RecordVC: {screen: RecordVC},
  BookDetailScreen: {screen: BookDetailScreen}
});

export const TabNavigator = createBottomTabNavigator({
  Home: { screen: HomeScreen},
  Book: { screen: BookStack},
  Mybook: {screen: MybookStack},
  Member: {screen: MemberStack},
  Record: {screen: RecordStack}
},

 以上代码,我想点击Record标签时并进入到

BookDetailScreen页面隐藏掉tab bar,之前很难处理是因为,  BookDetailScreen已经在navigator stack里面,只能调navigator的options,现在定义如下: 

RecordStack.navigationOptions= ({ navigation }) => {  
  let { routeName } = navigation.state.routes[navigation.state.index];  
  if(routeName=='BookDetailScreen'){  
      return {  
        tabBarVisible:false,  
      };  
  }  
};


这样建立某一个stack的专属navigationOptions,然后通过获取routeName获取页面,来改变属性


{ navigation }是上一层的navigation属性


tabBarVisible的属性值.


推理得出,原理分析:


BookVC: { screen: BookVC, navigationOptions:{header: null} }


 这样写,其实就是: 

BookVC.navigationOptions=({navigation})=>{}


 

 

获得的是navigator stack的navigation,所以效果就是无法修改 tabBarVisible