title: React Native Prop Not Being Passed To Child Component
body: <p>I am using <strong>react-native-router-flux</strong> as a router. This is my very first RN app in which I have a Home screen, and a chat screen. My home screen is working fine, and I am able to successfully navigate to to the chat screen upon button press. However, my home screen has an enough form and the value that the use enters (name) I want to pass to the chat screen as a prop. </p>
  
  <p>Main App component </p>
  
  <pre><code>import React, { Component } from 'react';
  import Home from './components/Home';
  import Chat from './components/Chat';
  
  import {
    Router,
    Stack,
    Scene,
  } from 'react-native-router-flux';
  
  class App extends Component {
    render() {
      return (
        &lt;Router&gt;
          &lt;Stack key='root'&gt;
            &lt;Scene key='home' component={Home} title='Home' /&gt;
            &lt;Scene key='chat' component={Chat} title='Chat' /&gt;
          &lt;/Stack&gt;
        &lt;/Router&gt;
      )
    }
  }
  
  export default App;
  </code></pre>
  
  <p>Home component </p>
  
  <pre><code>import React, { Component } from 'react';
  
  import {
    View,
    Text,
    StyleSheet,
    TextInput,
    TouchableOpacity,
  } from 'react-native';
  
  import {
    Actions,
  } from 'react-native-router-flux';
  
  class Home extends Component {
    constructor(props) {
      super(props);
      this.state = {
        name: '',
      }
    }
    render() {
      return (
        &lt;View&gt;
          &lt;Text style={styles.title}&gt;
            Enter your name:
          &lt;/Text&gt;
          &lt;TextInput
            style={styles.nameInput}
            placeholder='why so serious??'
            onChangeText={(text) =&gt; {
              this.setState({name:  text})
            }}
            value={this.state.name}
          /&gt;
          &lt;TouchableOpacity
            onPress={() =&gt; {
              Actions.chat({
                name: this.state.name,
              })
            }}
            &gt;
            &lt;Text style={styles.buttonText}&gt;
              Next
            &lt;/Text&gt;
          &lt;/TouchableOpacity&gt;
        &lt;/View&gt;
      )
    }
  }
  
  const styles = StyleSheet.create({
    title: {
      marginTop: 20,
      marginLeft: 20,
      fontSize: 20,
    },
    nameInput: {
      padding: 5,
      height: 40,
      borderWidth: 2,
      borderColor: 'black',
      margin: 20,
    },
    buttonText: {
      marginLeft: 20,
      fontSize: 20
    }
  })
  
  export default Home;
  </code></pre>
  
  <p>if I alert this.state.value on the onPress() function, the value is being captured and alerted. </p>
  
  <p>However, </p>
  
  <pre><code>Actions.chat({
                name: this.state.name,
              })
            }}
  </code></pre>
  
  <p>isn't recieving this input value. When the app goes to the chat screen it just says "hello"</p>
  
  <p>Chat component </p>
  
  <pre><code>import React, { Component } from 'react';
  
  import {
    View,
    Text,
  } from 'react-native';
  
  class Chat extends Component {
    render() {
      return (
        &lt;View&gt;
          &lt;Text&gt;
            Hello {this.props.name}
          &lt;/Text&gt;
        &lt;/View&gt;
      )
    }
  }
  
  export default Chat;
  </code></pre>
  
  <p>Am I simply over looking something here? any help is appreciated in passing prop from home to chat component.</p>
  
  <p>edit: 
  In the chat component when i alert(this.props.name) it alert Hello chat. The key from <code>&lt;Scene key='chat' component={Chat} title='Chat' /&gt;</code> in the app component is being passed down instead of the input value from the home component. Not sure why this is happening</p>