React FlatList renderItem

<FlatList
    data={['1', '2', '3', '4', '5', '6']}
    renderItem={({ item }) => (
        <Text>{ item }</Text>
    )}
/>

Output 1 2 3 4 5 6


data prop - need to pass an array of data to the FlatList via the data prop. That’s available on this.props.data.

renderItem prop - Then you want to render the content with the renderItem prop. The function is passed a single argument, which is an object. The data you’re interested in is on the item key so you can use destructuring to access that from within the function. Then return a component using that data.

render() {
 return (
      <FlatList
        data={this.state.data}
        renderItem={({ item }) => (
          // return a component using that data
        )}
      />
 );
}

adding to what @Balasubramanian stated, the renderItem points to the current item and since you are using a List component as a wrapper then you can also use the 'ListItem' component inside the renderItem function to render the current item's data, like so:

renderItem={({ item, index }) => {
  return (
     <ListItem
        key={index}
        title={item.name}
        onPress={ () => this.assetSelected(item) }
      />
  );
}