Flatlist does not listing all items in react native?

Viewed 155

I have used react-native-parallax-header npm for the parallax effect. Inside parallax, I have used flatlist.

Every time When I add a new category flatlist should reload the items fetched from API but in my case, it does not list all items. it shows only the last two items of the array. My array values contain 10 items but it shows only 2 items.

Here is the code for flatlist:

     const renderContent = (label) => (
        <View style={{ backgroundColor: '#FBFCFF', top: -10 }}>

            <CategoryListView>
                {this.state.categories && <FlatList
                    horizontal={false}
                    data={this.state.categories}
                    contentContainerStyle={{ paddingBottom: 20 }}
                    refreshControl={
                        <RefreshControl refreshing={refreshing} onRefresh={this.loadCategories} />
                    }
                    showsHorizontalScrollIndicator={false}
                    showsVerticalScrollIndicator={true}
                    renderItem={({ item }) => { return <CardActivity gotoCategoryDetail={this.gotoCategoryDetail} key={item._id} category={item}></CardActivity> }}
                    keyExtractor={(item) => item._id}
                />}
            </CategoryListView>

        </View>
    )

Here is the code for the get category list

loadCategories = async () => {
    this.setState({ refreshing: true });
    let categories = await this.props.getCategories();
    console.log(categories)
    this.setState({ categories, lastFetchCategoriesTime: new Date() });
};

Here is the constructor code

 constructor(props) {
    super(props);
    this.state = {
        categories: [],
        refreshing: false,
        scrollEnd: false,
    }

    this.loadCategories();
    const { navigation } = this.props;
    this.focusListener = navigation.addListener("focus", () => {
        // Call ur function here.. or add logic.    
        console.log(':::this will fire every time Page 1 receives navigation focus:::');
        this.loadCategories();
    });
};

Any help is much appreciated pls...

0 Answers
Related