react-navigation tab-navigation效果实现

Question

使用react-natvigation实现tab动态的气泡，气泡需要根据业务情况改变显隐状态，已知设置navigationOptions的tabBarIcon，无法根据业务需求动态改变tabBar的显隐状态，使用页面中元素绝对定位的方法，没法覆盖底部栏，即使zIndex设置到99999

static navigationOptions = {
    tabBarLabel: '标签',
    tabBarIcon: ({
      tintColor,
      focused
    }) => (
    <View>
    <View style={[TabNavStyle.TabNavIconBubble,{display:RecipeScreen.bubble?'flex':'none'}]}></View>
      <IconFont
      name='recipe'
      size={26}
      style={{ color: tintColor,...Platform.select({ios:{marginTop:-15}})}}
    />
  </View>
    ),
  }


render() {
    let {
      navigation
    } = this.props;
    let {
      navigate
    } = navigation;
    let {hosName,recipeList} = this.state;
    return (
      <BaseScreen hosName={hosName} banner="边栏" navigation={navigation} >
      <View style={{backgroundColor:'red',borderRadius:5,zIndex:65530,position:'absolute',width:10,height:10,left:30,bottom:-height+170}}></View>
   )}