Flatlist React Native - 无数据显示 [英] Flatlist React Native - No Data Display

查看:113
本文介绍了Flatlist React Native - 无数据显示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我们正在使用 Flatlist 开发 React Native 应用程序.绑定来自 API 服务的数据 &它的工作正常.假设服务中没有可用数据,我们需要为此显示单独的设计.

We are developing a react native application using Flatlist. Binding data from API service & its working fine. Suppose no data available in service we need to display separate design for that.

我们为此使用了renderEmptyListComponent"

We are using "renderEmptyListComponent" for that

分享代码,请查看

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

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

please guide me how can we do this?

推荐答案

可能想改用这个:

<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

Or if that also doesn't work do the old ternary jsx-eroo

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

希望能帮到你

这篇关于Flatlist React Native - 无数据显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆