React Native FlatList отображает только 10 предметов

Question

Я пытаюсь отобразить FlatList с набором данных из 86 элементов, и он отображает только 10 и больше не загружается.

Я попытался изменить размер контейнера с помощью стилей, но безрезультатно.

return (
  <View>
    <Text>{this.state.cards.length}</Text>
    <FlatList
      data={this.state.cards}
      renderItem={(theInfo) => <CardImage key={theInfo.key} info={theInfo}/>}
      keyExtractor={(item, index) => item.toString()}
    />
  </View>
);

Я ожидаю, что это отобразит 86 элементов (this.state.cards.length отображает 86), приложение отображает только 10 и больше не загружается.

Редактировать: версия 0.57.8

Answer 1

Изменить представление на ScrollView

Обновленный код:

return (
  <ScrollView>
    <Text>{this.state.cards.length}</Text>
    <FlatList
      data={this.state.cards}
      renderItem={(theInfo) => <CardImage key={theInfo.key} info={theInfo}/>}
      keyExtractor={(item, index) => item.toString()}
    />
  </ScrollView>
);

Answer 2

Вы должны установить следующее свойство

initialNumToRender={50}

По умолчанию 10

Источник: https://facebook.github.io/react-native/docs/flatlist#initialnumtorender