Datalarımızı render içerisinde sıralı şekilde listelemek için kullanırız, kullanımı kolay ve stabildir, en çok tercih edilen listeleme componentleri arasında baş sırayı oynar.
FlatList Component i react-native içerisinde dahili olarak gelir.
import {FlatList} from ‘react-native’
<FlatList style={styless.container}
data={this.state.data}
extraData={this.state}
ListFooterComponent={() =>
<View
style={{
paddingVertical: 20,
}}
>
</View>}
keyExtractor={(item, index) => String(index)}
renderItem={({ item, index }) => this.renderDatasi()}
/>Kullanımı yukarıda görüldüğü üzere oldukça basittir aldığı propslar . ;
| data = {} | dizi değeri alır ve burada verilen data flatlist içerisinde render edilir |
| extraData = {} | her değiştiğinde FlatList yeniden render edilir. |
| ListFooterComponent={} | Flatlist in en sonunda yer almasını istediğimiz data |
| keyExtractor = {} | her listelenen data için verilen uniqe ıd |
| renderItem={} | alınan dataların gösterim alanı yani tasarım alanıdır. |
| horizontal = {true} | render edilen dataların yan yana listelenmesini sağlarız, false alırsa alt alta render edilir |
| numRows={(integer)} | Yanyana listelenecek maksimum render component adını temsil eder (integer) değeri bir integer değer atanmalıdır |