title: Run function in parent component from child - React Navigator screen w/o redux
body: <p>I'm using react-native-i18n, react-native-popup-menu, react-navigation + expo (but I want eject soon). I want create settings screen when user can select language (autodetect or force: English, German etc.) and one-two other settings.</p>
  
  <p>I'm trying using AsyncStorage to store user's preference.
  When user change settings application I want set data in AsyncStorage and in state object in App.js (to refresh main component/full app if needed). But I have problem to using props.</p>
  
  <p>App.js fragment:</p>
  
  <pre><code>const navOpt = ({ navigation }) =&gt; ({   
    headerStyle: { backgroundColor: 'blue', elevation: null },
    headerRight: (&lt;Menu&gt;
      &lt;MenuTrigger&gt;&lt;MyIcon name="more" /&gt;&lt;/MenuTrigger&gt;
      &lt;MenuOptions&gt;
        &lt;MenuOption onSelect={() =&gt; navigation.navigate('Settings')} text='Settings' /&gt;
      &lt;/MenuOptions&gt;
    &lt;/Menu&gt;),
   });
  
  const RootNav = StackNavigator({
    Home: { screen: HomeScreen },
    Settings: { screen: SettingsScreen }
  }, {
    navigationOptions: navOpt
  });
  
  
  export default class App extends Component {
    constructor(props) {
      super(props);      
      this.langHandler = this.langHandler.bind(this);
  
      this.state = {
        isLoadingComplete: false,
        currentLang: '',
        selectedLang: null,
        selectedTheme: null
      };
     }
  
    async componentWillMount() {    
      try {
      AsyncStorage.multiGet(['lang', 'theme'],   (err, stores) =&gt; {
          this.setState({ selectedLang: stores[0].lang });
          this.setState({ selectedTheme: stores[0].theme });    
      });
      } catch (e) {
        console.log(e);
        return;
      }
  
     try {
        await I18n.initAsync();
      } catch (e) {
        console.log(e);
        return;
      }
      console.log(this.state.selectedLang);
      if (this.state.selectedLang != null &amp;&amp; this.state.selectedLang !== '') {
          this.setState({ currentLang: this.state.selectedLang });
          } else {
          this.setState({ currentLang: I18n.locale });
          }
      this.setState({ isLoadingComplete: true });   
      console.log(this.state);
    }
  
    langHandler(lang) {
      console.log(`xx${lang}`);
      this.setState({
          isLoadingComplete: false
      });
  }
  
    render() {
    if (this.state.isLoadingComplete) return (&lt;MenuProvider&gt;&lt;RootNav /&gt;&lt;/MenuProvider&gt;);
      return &lt;View /&gt;;
    }
  }
  </code></pre>
  
  <p>SettingsScreen.js - this is simplest version:</p>
  
  <pre><code>import React, { Component } from 'react';
  import { StyleSheet, View, Button, TextInput, AsyncStorage } from 'react-native';
  
  class SettingsScreen extends Component {
    static navigationOptions = {
      title: 'Settings',
    };
    constructor(props) {
      super(props);
      this.state = {
        text: ''
      };
    }
      saveData() {
        AsyncStorage.setItem('lang', this.state.text);
        this.props.langHandler(this.state.text);
      }
      render() {
        return (
          &lt;View style={styles.container}&gt;
            &lt;View&gt;
                &lt;TextInput onChangeText={(text) =&gt; this.setState({ text })} /&gt;
               &lt;Button title='set' onPress={() =&gt; this.saveData()} /&gt;
            &lt;/View&gt;
          &lt;/View&gt;
        );
      }
    }
  </code></pre>
  
  <p>I'm trying set something like </p>
  
  <pre><code> const RootNav = StackNavigator({
        Home: { screen: HomeScreen },
        Settings: { screen: props =&gt; &lt;SettingsScreen (...props) /&gt;}
  </code></pre>
  
  <p>But dosen't work.
  Maybe I need use Redux? But if is possibility to avoid this is better :)
  Maybe I should do all in different way?</p>
  
  <p>Thank you for your time.
  Best Regards</p>