I switched from using a FlatList to a VirtualizedList, and I got the error this.props.getItemCount is not a function. When I ran the debugger, the exception is thrown from VirtualizedList.js

<VirtualizedList
    data={contacts}
    getItem={(data, index) => data[index]}
    getItemCount={data => data.length}
    renderItem={({ item }) => (
        <ContactListItem
        name={item.name}
        number={item.number}
        />
    )}
/>

I switched from using a FlatList to a VirtualizedList, and I got the error this.props.getItemCount is not a function. When I ran the debugger, the exception is thrown from VirtualizedList.js

<VirtualizedList
    data={contacts}
    getItem={(data, index) => data[index]}
    getItemCount={data => data.length}
    renderItem={({ item }) => (
        <ContactListItem
        name={item.name}
        number={item.number}
        />
    )}
/>

• javascript
• reactjs
• react-native

2 Answers 2

Unlike FlatList, VirtualizedList requires the props getItem and getItemCount (React Native Docs).

<VirtualizedList
    data={contacts}
    getItem={(data, index) => data[index]}
    getItemCount={data => data.length}
    renderItem={({ item }) => (
        <ContactListItem
        name={item.name}
        number={item.number}
        />
    )}
/>

If you used VirtualizedList and you still have the same error, use SafeAreaView import it from react-native and add FlatList inside it

import {FlatList,SafeAreaView} from 'react-native';
<SafeAreaView>
  <FlatList
    keyExtractor={(item, i) => item.id.toString()}
    data={favoriteFilm}
    renderItem={({item}) => (
      <FavoritesItemFilm
        title={item.title}
        description={item.overview}
        vote={item.vote_count}
        release={item.release_date}
        image={item.poster_path}
        id={item.id}
      />
    )}
  />
</SafeAreaView>