react-native – React Navigation在返回时重新渲染上一页

我使用hooonkos onNavigationStateChange方法使用它粘贴下面创建的示例.我没有拿出这个解决方案所有功劳应该去hooonko.

import React,{ Component } from 'react';
import {
  AppRegistry,StyleSheet,Text,View
} from 'react-native';
import { TabNavigator } from 'react-navigation';
import Icon from 'react-native-vector-icons/FontAwesome';


class MyHomeScreen extends React.Component {
  static navigationOptions = {
    tabBarLabel: 'Home',// Note: By default the icon is only shown on iOS. Search the showIcon option below.
    tabBarIcon: ({ tintColor }) => (
      <Icon
        name="home"
        size={30}
        color={tintColor}
      />
    ),};

  _myHomeFunction = () => {
    alert('Here is home tab!');
  }

  componentWillReceiveProps(newProps) {
    if (newProps.screenProps.route_index === 0) {
      this._myHomeFunction();
    }
  }
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.text}>
          Home
        </Text>
      </View>
    );
  }
}

class MyRocketScreen extends React.Component {
  static navigationOptions = {
    tabBarLabel: 'Rocket',tabBarIcon: ({ tintColor }) => (
      <Icon
        name="rocket"
        size={30}
        color={tintColor}
      />
    ),};

  _myRocketFunction = () => {
    alert('Here is rocket tab!');
  }

  componentWillReceiveProps(newProps) {
    if (newProps.screenProps.route_index === 1) {
      this._myRocketFunction();
    }
  }
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.text}>
          Rocket
        </Text>
      </View>
    );
  }
}

const MyApp = TabNavigator({
  Home: {
    screen: MyHomeScreen,},Rocket: {
    screen: MyRocketScreen,{
  tabBarOptions: {
    activeTintColor: '#e91e63',});

class rn extends Component {
  _onNavigationStateChange = (prevState,newState) => {
    this.setState({...this.state,route_index: newState.index});
  }
  render() {
    return (
      <MyApp onNavigationStateChange={this._onNavigationStateChange} screenProps={this.state} />
    )
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,justifyContent: 'center',alignItems: 'center',backgroundColor: '#F5FCFF',text: {
    fontSize: 20,textAlign: 'center',margin: 10,});

AppRegistry.registerComponent('rn',() => rn);