screenProps are not available in navigationOptions.tabBar

[davidruisinger]

I'm trying to display some badgeCounts from my redux state in a Tabbbar

I have the following Component structure:
RootComponent (is connected to redux state which contains e.g. badgeCounbts for my Tabbar)
renders:

<Tabs screenProps={{
      badgeCount,
    }}
/>

Tabs component
is just a js file that export:

const Tabs = TabNavigator({
  Home: {
    screen: props => {
      console.log(props)  // {badgeCount: 0, navigation: Object}
      return <TabHome screenProps={{
        badgeCount: props.badgeCount,
      }} />
    },
    path: 'home',
    navigationOptions: {
      tabBar: navigation => {
        console.log(navigation.props) // undefined
        return {
          icon: ({ tintColor, focused }) => {
            return <TabIcon badgeCount={ navigation.props.badgeCount } />
          },
        }
      }
    },
  },
...
}, {
  swipeEnabled: false,
  animationEnabled: true,
  backBehavior: 'none',
  tabBarOptions: {
    style: styles.tabBar,
    activeTintColor: DXColors.secondary,
    inactiveTintColor: DXColors.text_important_light_bg,
    showLabel: false,
  },
})

Is there any way to access the screenPropswithin my navigationsOptions.tabBar function?
I think I could just move the render function to the screen component (?) but I'd like to keep the tabbar stuff centralized in one file.

[SpaceK33z]

This is kinda related to / a dupe of #210 and #145 I think.

[DaveCole]

I've found if you add screenProps to the navigationOptions method arguments, you get them:

navigationOptions: ({ navigation, screenProps }) => ({ tabBarLabel: 'screenProps.foo: '+screenProps.foo });

Unfortunately if these values change, the Tab Bar does not rerender currently.

[spencercarli]

Closing in favor of linked issues.