Flatlist React Native - 无数据显示

时间:2017-08-10 10:28:16

标签: reactjs react-native reactive-programming

我们正在使用Flatlist开发一个react本机应用程序。绑定来自API服务和数据的数据;它的工作正常。假设在服务中没有可用的数据,我们需要为此显示单独的设计。

我们正在使用“renderEmptyListComponent”

分享代码,请检查

<FlatList style={{ backgroundColor: 'white' }}
              data={this.state.dataSource}
              renderItem={({ item }) => (this.renderMovie(item))}
              keyExtractor={item => item.salesID}
              renderEmptyListComponent= {this.noItemDisplay}
              ItemSeparatorComponent={this.renderSeparator}>
            </FlatList>

请指导我们如何做到这一点?

1 个答案:

答案 0 :(得分:4)

可能想要使用它:

<FlatList 
  style={{ backgroundColor: 'white' }}
  data={this.state.dataSource}
  renderItem={({ item }) => (this.renderMovie(item))}
  keyExtractor={item => item.salesID}
  ListEmptyComponent={this.noItemDisplay}
  ItemSeparatorComponent={this.renderSeparator}>
</FlatList>

或者如果那也不起作用那就做旧的三元jsx-eroo

{ this.data ? <FLatList /> : null }

希望这有帮助