FlatList не проходит через 0 или ноль в свойство renderItem - PullRequest
Новая
       0

FlatList не проходит через 0 или ноль в свойство renderItem

0 голосов
/ 08 мая 2018

Если я попытаюсь отобразить FlatList следующим образом: 

<View>
   <FlatList
     numColumns={2}
     data={[1, 0, 3, null]}
     renderItem={(itemData, idx) => <Text key={idx}>{itemData.item}</Text>}
     horizontal={false}
   />
</View>

Единственное возвращаемое значение будет 1 и 2 (за исключением того, что они занимают место в строке / столбце, как если бы другие значения также отображались - они складываются в столбце). У меня нет доступа к значению 0 или значению null (поэтому я не могу условно отобразить что-то еще, т.е. return itemData.item || 'No Data'.

Если я попробую это (с чуть меньшим количеством реквизита): 

<View>
    <FlatList
      data={[1, 0, 3, null]}
      renderItem={(itemData, idx) => <Text key={idx}>{itemData.item}</Text>}
    />
</View>

Я получаю ошибку Invariant Violation: No item for index 2.

Есть ли решение, кроме циклического предварительного просмотра данных и замены всех 0 на строку "0" и всех null s, undefined, пустых строк и т. Д. На строку "null" и условно рендеринг с этим: return itemData.item !== 'null' ? itemData.item || 'No Data'

1 Ответ

0 голосов
/ 09 мая 2018

Похоже, что при попытке доступа к itemData.0 он понимается как false вместо числа 0, та же логика выглядит применимой при попытке доступа к значению itemData.null.

Если вы добавите console.log к вашему renderItem, вы можете подтвердить, что то, что я сказал, верно 

renderItem={(itemData, idx) => {
  console.log('Trying to render item: ', idx);
  return <Text key={idx}>{itemData.item}</Text>;
}}

Предположим, что это так, тогда вы можете достичь того, чего хотите, что-то вроде этого:

renderItem={(itemData, idx) => itemData.item && <Text key={idx}>{itemData.item}</Text>}

Надеюсь, это поможет

...