Alwaysblue
Alwaysblue

Reputation: 11830

How to Render only few elements in FlatList

I am having say about 100 elements in my array/object

I am using FlatList to display it

   <FlatList
    data={this.props.redditCryptoNews}
     maxToRenderPerBatch={5}
    renderItem={({index, item}) => {
     return (
        <Text style={RedditList}>{item["data"]["title"]}</Text>)}} />

Now, I just want to display just 10 elements in my flatlist instead of displaying all 100 elements

For some reason, I think Facebook haven't done good job with its react-native documentation which makes it sort of hard for me to comprehend

[Question:] How Can I achieve it?

Upvotes: 2

Views: 7344

Answers (1)

Alwaysblue
Alwaysblue

Reputation: 11830

Okay, It was stupid of me.

We can simply slice the data we are passing.

 <FlatList
    data={this.props.redditCryptoNews.slice(0,5)}
     maxToRenderPerBatch={5}
    renderItem={({index, item}) => {
     return (
        <Text style={RedditList}>{item["data"]["title"]}</Text>)}} />

Notice .slice(0,5) here

  data={this.props.redditCryptoNews.slice(0,5)}

Upvotes: 11

Related Questions