FlatList

Learn how to render data with infinite scrolling using the FlatList component.

The FlatList component is an efficient way to display lengthy lists of data that are too big to fit on a single screen. It improves the application’s performance since the data is only rendered when it appears on the screen. This contrasts with the ScrollView component that renders all the data at once. The FlatList component comes with many built-in useful features, such as pull-to-refresh, scroll loading, and multi-column support.

Usage

To implement and use the FlatList component, we first have to import it from the react-native library.

Press + to interact
import { FlatList } from 'react-native';

Once the FlatList component has been imported, we can use it inside our application using the <FlatList/> tag. The following props must be passed to the FlatList component:

  • data: This is the source of elements to ...