title: passing array state to another class react native
body: <p>I am new to React Native. I am making a lunch picker app for practice, and I wonder how to pass array of state to another class. 
  What I want to do is: show all data of array in child screen, so users can check the data by clicking on a button.
  However, it seems like my code returns null array instead of getting original array. All codes are in one file, App.js</p>
  
  <p><strong>Home screen</strong></p>
  
  <pre><code>class HomeScreen extends React.Component {
  //initial
  constructor(props) {
    super(props);
    this.state = {
      isReady: false,
      myMenu: '????',
      menutext: '',
      randomArray: ['a', 'b', 'c'],
    };
  }
  
  render() {
  
  
      return (
        &lt;View style={[styles.mainContainer]}&gt;
          &lt;DetailsScreen menuListAA={this.state.randomArray} /&gt;
          &lt;Button
            label="Show all menu"
            onPress={() =&gt; {
              /* 1. Navigate to the menu page route with params */
              this.props.navigation.navigate('Details', {
                itemId: 0,
                otherParam: 'Show all menu',
              });
            }}
          /&gt;
  
        &lt;/View&gt;
  </code></pre>
  
  <p><strong>Details screen</strong></p>
  
  <pre><code>class DetailsScreen extends React.Component {
  
  
    constructor(props) {
      super(props);
      this.state = {
  
      }
    }
    static navigationOptions = {
      title: 'All menu',
    };
  
  loadMenuList() {
    const allMenuList = this.props.menuListAA;
    return allMenuList.map((item, index) =&gt; &lt;Text key={index}&gt;{item}&lt;/Text&gt;);
  
  }
  
    render() {
  
      return (
        &lt;ScrollView&gt;
  
  
          &lt;View style={styles.row}&gt;{this.props.menuListAA}&lt;/View&gt;
  
          &lt;Button
            label="Go back"
            onPress={() =&gt; this.props.navigation.goBack()}
          /&gt;
        &lt;/ScrollView&gt;
      );
    }
  }
  
  const RootStack = createStackNavigator(
    {
      Home: HomeScreen,
      Details: DetailsScreen,
    },
    {
      initialRouteName: 'Home',
    }
  );
  
  const AppContainer = createAppContainer(RootStack);
  
  export default class App extends React.Component {
  
    render() {
      return &lt;AppContainer /&gt;;
    }
  }
  </code></pre>
  
  <p>Let me know if you need more information.</p>