Массив рендеринга FlatList в неправильном порядке - PullRequest
Новая
       56

Массив рендеринга FlatList в неправильном порядке

0 голосов
/ 02 мая 2020

Я реализую плоский список в своем приложении React Native. Я запрашиваю данные из Firebase и получаю массив объектов. Что-то странное происходит -> FlatList отображает только последние элементы всего массива, и в таком порядке, что я не могу прокрутить, так как больше нет данных. Пример:

У меня есть массив с [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

И FlatList будет отображать, скажем, только 4 элемента , Это то, что он рендерит, и в следующем порядке:

FlatList в телефоне 

   4
   3
   2
   1

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

Мой код очень прост: 

        <FlatList
          windowSize={1}
          initialNumToRender={10}
          maxToRenderPerBatch={10}
          contentContainerStyle={styles.container}
          data={data}
          keyExtractor={(item, index) => index.toString()}
          renderItem={itemData => {
            let image = {uri: itemData.item.i};
            return (
              <CustomCardsRecipe
                img={image}
                id={itemData.item.id}
                navigate={() =>
                  this.props.navigation.navigate('MainRecipe', {
                    recipe: itemData.item,
                  })
                }
                showToastFunction={message => this.showToastFunction(message)}>
                {itemData.item.t}
              </CustomCardsRecipe>
            );
          }}
        />

Кто-нибудь знает, почему это происходит? Я мог бы действительно использовать некоторую помощь. Спасибо!

1 Ответ

0 голосов
/ 02 мая 2020

Проблема была в моем стиле.

У меня было это: 

flexDirection: 'column-reverse',

Просто удалив эту строку, это сработало.

...