javascript - 我不知道如何使 ListView 正常工作

Question

我试图在 React Native 中呈现一个列表，但是，什么也没有显示。我也在渲染之前记录列表，它显示正在填充数据字段，但没有显示任何内容。

This is the ListView code that I am trying that is NOT working.

This is the way that I am currently rendering the list. This method is working for me.

我想使用 ListView 而不是我正在使用的当前方法的原因是因为我从文档中了解到 ListView 具有更好的属性和性能。

谢谢!

Answer 1

尝试正确解构 renderItem 中的项目。我的意思是:

  <FlatList 
    data={this.state.users}
    renderItem={({item}) => {
      return (
        <View>
          <Image source={{uri: item.image}} style={{width: 150, height: 150}} />
          <Text>{item.login}</Text>
        </View>
      )
    }}
    keyExtractor={(user) => user.id}
  />

或者，如果您更喜欢将其称为 info，请定义一个函数:

  renderItem = (info) => {
    return (
      <View>
        <Image source={{uri: info.image}} style={{width: 150, height: 150}} />
        <Text>{info.login}</Text>
      </View>
    )
  }

并称它为

  <FlatList 
    data={this.state.users}
    renderItem={({item}) => this.renderItem(item)}
    keyExtractor={(user) => user.id}
  />

查看更多in the offical doc