How to render buttons in a flatlist react-native?

Question

I have two buttons which i'm trying to render in a flatlist so that it iterates and displays multiple times as a list. How should i do it?

<FlatList
  data={this.state.data}
  extraData={this.state}
  renderItem={this.renderItem}
  keyExtractor={items => items.id}
/>
<TouchableOpacity onPress={this.onPressButtonPlay.bind(this)}>
  <Text style={styles.buttonText}> </Text>
</TouchableOpacity>

<TouchableOpacity onPress={this.onPressButtonPause.bind(this)}>
  <Text style={styles.buttonText}>{this.state.pause ? 'Resume' : 'Pause'}</Text>
</TouchableOpacity>

Answer 1

Just simply insert it within your renderItem function:

renderItem = ({item}) => {
  return(
      <TouchableWithoutFeedback>
        <TouchableOpacity>
            {this.renderButton()}
        </TouchableOpacity>
      <TouchableWithoutFeedback>
  );
}