More than 5 years have passed since last update.

ReactNativeの世界一シンプルなFlatListサンプル

Last updated at 2018-07-03Posted at 2018-06-17

FlatListは動的なlistコンポーネントだ。
静的なリストはScrollViewを使う。

使い方は簡単で配列をdataに渡し、renderItemで表示を示す。


<FlatList data={[1, 2, 3]} renderItem={({item}) => <Text>{item}</Text>}/>

結果
1
2
3

以下は公式のサンプル。ハッシュも使える。

<FlatList
　　　　data={[{key: 'a'}, {key: 'b'}]}
  renderItem={({item}) => <Text>{item.key}</Text>}
/>

結果
a
b