[FlatList] Sometimes FlatList rows are rendered, but not displayed until scroll. RN 0.43

Description

When using FlatList, rows are not displayed though renderItem is called. Rows appear immediately when scroll is triggered on the list.

Reproduction Steps and Sample Code

export default class List extends Component {
  renderItem({item}) {
    return (
      <Text>{item}</Text>
    );
  }

  render() {
    return (
      <FlatList
        style={{
          flex: 1,
          backgroundColor: 'white',
        }}
        data={[1, 2]}
        renderItem={this.renderItem}
      />
    );
  }
}

Solution

FlatList should always display its rendered items.

Additional Information

• React Native version: 0.43.0
• Platform: iOS
• Development Operating System: MacOS
• Dev tools: Xcode

[sahrens]

Does setting removeClippedSubviews={false} fix the issue? Sounds like the issue might be related to the navigator which would explain why we don’t see this problem at Facebook. cc @shergin

[Kiarash-Z]

Hi mine fixed by giving style={{ backgroundColor: 'white' }} to flat list