title: Passing data from List Item to child component react native
body: <p>I have Flatlist display data in a ListItem from a fetch request as shown.</p>
  
  <p><strong>ListTrips.js</strong></p>
  
  <pre><code>export default class ListTrip extends Component {
  ....
    toggleModalConfirmTrip = item =&gt; {
  if (this.ModalConfirmTrip) {
    this.ModalConfirmTrip.toggleModal();
  }
  };
  
  &lt;FlatList
     data={data}
     renderItem={({ item }) =&gt; (
        &lt;ListItem
           *onPress={() =&gt; this.toggleModalConfirmTrip(item)*}
           roundAvatar
           title={`${item.location_from} to ${item.location_to} `}
           subtitle={item.user[0].name}
           rightTitle={item.timeStamp}
           avatar={
              &lt;Image
                 source={require('../assests/carLogo.png')}
                 style={{ width: 40, height: 50, borderRadius: 10 }}
              /&gt;
           }
           containerStyle={{ borderBottomWidth: 0, paddingBottom: 10 }}
        /&gt;
     )}
     // Uses object ID to iterate over the trips
     keyExtractor={item =&gt; item._id}
     ItemSeparatorComponent={this.renderSeparator}
     ListHeaderComponent={this.renderHeader}
     ListFooterComponent={this.renderFooter}
     refreshing={refreshing}
     onRefresh={this.handleRefresh}
             .
             . 
             .
  </code></pre>
  
  <p>I want to pass the data of the selected item to a modal component (a child of ListTrips) so I can display it.  I attempted to do it by passing <code>item</code> in  <code>onPress={() =&gt; this.toggleModalConfirmTrip(item)}</code> but it didn't work.
  I know I have to pass it as a prop down to my child component but I'm sure how.</p>
  
  <p>ModalConfirmTrip.js</p>