Scenes do not re-render when navigating with tabbar

[vandervidi]

Version

Tell us which versions you are using:

• react-native-router-flux v3.22.23
• react-native v0.29.0

Expected behaviour

Press a tabbar icon, scene re-renders the component related to it

Actual behaviour

component is not re-rendered

[brien-crean]

@vandervidi From what I understand components attached to a tab are not unmounted when you switch between different tabs on a tab bar and will only re-render if their state changes.

For example if using something like redux you need listen for a "jump" action, and then change state in order to hook into one of the React lifecycle hooks like componentDidUpdate or componentWillReceiveProps.

For example doing something like this will alllow you to tell if a tab is selected:

// listen in reducer for tab1 selected
// Note: jump action is fired by defaultReducer attached to main Router (see example project)
case "jump":
      if(action.key=="tab1") {
        return {
          ...state,
          tab1: true
        }
      }

// reset tab1 to false (triggered by action call in component)
case TAB_ONE:
      return {
        ...state,
        tab1: false,
      }

// Tab 1 Component
  componentDidUpdate(prevProps) {
    // on tab1 press
    if(this.props.tab1) {
      console.log("Tab 1 Pressed")
      // fires TAB_ONE action
      this.props.resetTab()
    }
  }

[Proyoyo]

A support for this would be really useful

[conan52]

i have same issue. I use RN 0.30.0 and react-native-router-flux 3.30.6. When change screen tab component is not re-rendered?
How to fix it?

[kaminskypavel]

using 3.35 same issue