Discovery Solutions - React FlatList

A FlatList ReactJS Component For Large Lists

npm i @discovery-solutions/react-flatlist

Conteúdo

• Utilização Padrão
• APIs Suportadas

Utilização Padrão

A primeira coisa a ser feita é instanciar o provider, assim:

import React from "react";
import FlatList from "@discovery-solutions/react-flatlist";

const App = () => (
    <FlatList
        data={[ 1, 2, 3, 4, 5 ]}
        renderItem={({ item }) => (
            <p>{ item }</p>
        )}
    />
)

export default App;

APIs suportadas

name	type	default	description
data	array	[]	.
renderItem	function	() => null	.
onTopReached	function	() => null	when flatlist is scrolled to the top
onEndReached	function	() => null	when flatlist is scrolled to the bottom
initialNumToRender	number	30	.
ListEmptyComponent	component/node/function	null	render when data is an empty array
ListHeaderComponent	component/node/function	null	.
ListHeaderComponentStyle	style object	null	.
ListFooterComponent	component/node/function	null	.
ListFooterComponentStyle	style object	null	.
Component	component / function	div	this is a custom component for the flatlist container