Реагировать на собственное предупреждение FlatList - PullRequest
3 голосов
/ 21 марта 2019

Я пытаюсь реализовать FlatList с динамическими размерами элементов, если быть более точным, мои элементы иногда занимают всю ширину экрана, а иногда только половину, поэтому настройка numColumns = {2} не работает, мой обходной путь выглядитэто:

     <FlatList
      ListHeaderComponent={this.header}
      keyExtractor={item => item.id.toString()}
      data={data}
      contentContainerStyle={{ flexDirection: 'row' }}
      renderItem={({ item }) => <Item item={item} />}
    />

все работает как положено, ширина элемента применяется через item.width.Однако проблема в том, что каждый раз, когда он рендерит список, я получаю следующее предупреждение журнала:

Warning: `flexWrap: `wrap`` is not supported with the `VirtualizedList` components.Consider using `numColumns` with `FlatList` instead.

Кто-нибудь знает, как это влияет на производительность списка и если это влияет, как я могу улучшитьмой код?

Вот как бы я хотел, чтобы он выглядел так:

Example

1 Ответ

0 голосов
/ 21 марта 2019

чтобы исправить numColumns = {2}, вы должны установить с ним горизонтальный = {false} так становится

      <FlatList
        ListHeaderComponent={this.header}
        keyExtractor={item => item.id.toString()}
        data={data}
        horizontal={false}
        numColumns={2} 
        contentContainerStyle={{ flexDirection: 'row' }}
        renderItem={({ item }) => <Item item={item} />}
       />
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...