title: get index from flatlist react native
body: <p>So I am basically looking for the error and what I am doing wrong,
  I got a data with diffrent key for each, and I am trying to get the data of the activeRow, 
  for some reason I got undefined for some reason, what is going on? Thanks!
  I am getting undefined after trying to log the "this.props.index" I already called constructor(props) and super(props), So I have no idea why why I am trying to log my prop it says undefined instead of giving me the index or the item...</p>
  
  <p>there is my render!</p>
  
  <pre><code>render() {
    const swipeSettings = {
      autoClose: true,
      buttonWidth: 130,
      onClose: (secId, rowId, direction) =&gt; {
        if (this.state.activeRowKey != null) {
          this.setState({ activeRowKey: null })
        }
      },
      onOpen: (secId, rowId, direction) =&gt; {
        this.setState({ activeRowKey: this.props.index })
        console.log(this.state.activeRowKey)
      },
      right: [
        {
          onPress: () =&gt; {
  
          },
          text: 'Verify', type: 'default', backgroundColor: 'lime', color: 'black', component: (
            &lt;View
              style={{
                flex: 1,
                alignItems: 'center',
                justifyContent: 'center',
                flexDirection: 'column',
              }}
            &gt;
              &lt;Ionicons name="md-checkmark" size={40} /&gt;
            &lt;/View&gt;
          )
        }
      ],
      left: [
        {
          onPress: () =&gt; {
  
          },
          text: '', type: 'default', backgroundColor: '#e6e6e6', color: 'black', component: (
            &lt;View
              style={{
                flex: 1,
                alignItems: 'center',
                justifyContent: 'center',
                flexDirection: 'column',
              }}
            &gt;
              &lt;Ionicons style={{ color: 'green' }} name="ios-call" size={40} /&gt;
            &lt;/View&gt;
          )
        }
      ],
      rowId: this.props.index,
      sectionId: 1
    };
    if (this.state.loading) {
      return (
        &lt;View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}&gt;
          &lt;ActivityIndicator /&gt;
        &lt;/View&gt;
      );
    }
    return (
      &lt;View style={{ flex: 1, backgroundColor: 'grey' }}&gt;
        &lt;SearchBar
          placeholder="Type Here..."
          lightTheme
          round
          height={60}
          onChangeText={text =&gt; this.searchFilterFunction(text)}
          autoCorrect={false}
          value={this.state.value}
        /&gt;
        &lt;FlatList
          data={this.state.data}
          renderItem={({ item,index }) =&gt; (
            &lt;Swipeout {...swipeSettings}&gt;
              &lt;ListItem
                keyExtractor={this.keyExtractor}
                index={index}
                titleStyle={{ textAlign: 'center', fontWeight: 'bold', color: 'black', fontSize: 20, height: 60, maxHeight: 35, justifyContent: 'center' }}
                title={`${item.guestname}`}
              /&gt;
            &lt;/Swipeout&gt;
          )}
          keyExtractor={item =&gt; item.key}
          contentContainerStyle={{ margin: 5, textAlign: 'center', }}
          ItemSeparatorComponent={this.renderSeparator}
        /&gt;
        &lt;SafeAreaView style={{ height: 100, backgroundColor: '#3271e7', justifyContent: 'center', alignItems: 'center' }}&gt;
          &lt;TouchableOpacity style={{ justifyContent: 'center', alignItems: 'center' }}&gt;
            &lt;Ionicons style={styles.imagestyle} size={60} name="ios-barcode" /&gt;
          &lt;/TouchableOpacity&gt;
        &lt;/SafeAreaView&gt;
      &lt;/View&gt;
    );
  }
  </code></pre>