Question

作为Manifest.xml的一部分，我渲染了每个FlatList（来自ListItem库），在其中尝试显示从URL到照片的化身（图标）：

react-native-elements

所有其他道具都可以正常显示，但是在每个单元格的左侧，我只得到一个灰色框。我已经记录了<ListItem avatar={{ source: { uri: item.icon } }} />的值，它指向有效的照片。我需要下载照片然后提供本地链接吗？

如何使照片显示为单元格的化身？

Answer 1

您为图像头像使用了错误的对象。

稳定版本

任一

avatar={{ uri: item.icon }}

OR

avatar={<Avatar
           rounded
           source={{uri: item.icon}}
           title={'Sample Title'}
       />}

测试版

leftAvatar={{ source: { uri: item.icon } }}

Answer 2

根据react-native元素，他们离开了头像并且不只是头像

<ListItem
        key={i}
        leftAvatar={{ source: { uri: l.avatar_url } }}
        title={l.name}
        subtitle={l.subtitle}
      />

Answer 3

这是我使用图标（react-native-elements / flatlist）自定义我的leftAvatar的方法

 leftAvatar={{
        icon: { name: item.icon, type: "ionicon", color: "black" },
        size: "large",
        overlayContainerStyle: { backgroundColor: "white" }
      }}

ListItem头像未显示

3 个答案:

稳定版本

测试版