title: rerender component when tab is choosed react-native
body: <p>I'm using TabNavigator from react-navigation to navigate through 3 component. My TabNavigator component look like this:</p>
  
  <pre><code>import routeOnMap from '../screens/routsOnMap.js';
  import meditatinWalk from '../screens/meditationWalk.js';
  import newWordToWalkOn from '../screens/newWordToWalkOn.js';
  import * as firebase from 'firebase';
  
  import React, { Component } from 'react';
  import {
    Platform,
    StyleSheet,
    Text,
    View,
    Button
  } from 'react-native';
  
  import {
    StackNavigator,
    NavigationActions,
    TabNavigator,
    TabBarBottom,
  } from 'react-navigation';
  
  import Ionicons from 'react-native-vector-icons/Ionicons';
  
  export default TabNavigator(
  {
    MeditatinWalk: { screen: meditatinWalk },
    NewWordToWalkOn: { screen: newWordToWalkOn },
    RouteOnMap: { screen: routeOnMap },
  
  },
  {
    navigationOptions: ({ navigation }) =&gt; ({
      tabBarIcon: ({ focused, tintColor }) =&gt; {
        const { routeName } = navigation.state;
        let iconName;
        if (routeName === 'MeditatinWalk') {
          iconName = `ios-walk${focused ? '' : '-outline'}`;
        } else if (routeName === 'NewWordToWalkOn') {
          iconName = `ios-add-circle${focused ? '' : '-outline'}`;
        } else if (routeName === 'RouteOnMap') {
          iconName = `ios-map${focused ? '' : '-outline'}`;
        }
  
        // You can return any component that you like here! We usually use an
        // icon component from react-native-vector-icons
        return &lt;Ionicons name={iconName} size={25} color={tintColor} /&gt;;
      },
    }),
    tabBarOptions: {
      activeTintColor: '#626A41',
      inactiveTintColor: 'gray',
    },
    tabBarComponent: TabBarBottom,
    tabBarPosition: 'bottom',
    animationEnabled: false,
    swipeEnabled: false,
  }
  );
  </code></pre>
  
  <p>I want to rerender whats inside my NewWordToWalkOn component when it's when it is pressed/tabbed. The code I would like to rerender is whats inside the componentDidMount() methode in the NewWordToWalkOn component.</p>
  
  <pre><code>//imports
  
  export default class NewWordToWalkOn extends Component {
  constructor() {
   super()
     this.state = {
     words: [],
   };
  }
  
  static navigationOptions = ({ navigation }) =&gt; ({
   title:
    &lt;Text style={{ fontWeight: 'bold', color: '#626A41'}}&gt; Vælg nye ord at vandre på &lt;/Text&gt;,
  headerLeft: null,
  headerRight:
    &lt;TouchableOpacity
      style={{ flex: 1, alignItems: 'center', justifyContent: 'center', marginRight: 10 }}
      onPress={ () =&gt; MeditatinWalk._logout() }&gt;
        &lt;Text
          style={{ fontWeight: 'bold', color: '#626A41'}}&gt;
          Log ud
        &lt;/Text&gt;
    &lt;/TouchableOpacity&gt;
  });
  
   componentDidMount() {
    //code that needs rerendered
   }
  
  
  render() {
  
  )
  
  return (
    &lt;ScrollView style={styles.wrapper}&gt;
      //all the elements
    &lt;/ScrollView&gt;
  );
  }
  }
  </code></pre>
  
  <p>Any suggestions how to rerender?</p>