我有问题，我的刷卡器不显示图像

Question

我正在使用 react-native-swiper-flatlist.Swiper 和来自 swiper 的点在那里，但没有显示图像。我对 react-native 很陌生。这是我的代码：

<SwiperFlatList
          autoplay
          autoplayDelay={2}
          autoplayLoop
          index={2}
          showPagination
          data={img}
          renderItem={({ item }) =>{
            return(
              <Image style={{width, height: 200, backgroundColor:"#f0ffff" }} source={{uri:item.uri}}/>
            )
          } }
        />

Answer 1

• 首先尝试将 SwiperFlatList 保留在 View Component 中，并且样式应该是 flex:1。
• 仔细检查您的数据格式是什么以及如何在 Image 中呈现。

否则请分享完整的源代码。

您的图像数据不是来自网络，这是本地数据，因此请使用以下代码：

<Image style={{width, height: 300, backgroundColor:"#f0ffff",flex: 1 }} source={item.uri}/>

而不是

<Image style={{width, height: 300, backgroundColor:"#f0ffff",flex: 1 }} source={{uri:item.uri}}/>

也改变数据格式：

const img=[
    {uri:'../../assets/image.png', key: '1'},
    {uri:'../../assets/image.png', key: '2'},
    {uri:'../../assets/image.png', key: '3'}
  ];

到

const img=[
    {uri:require('../../assets/image.png'), key: '1'},
    {uri:require('../../assets/image.png'), key: '2'},
    {uri:require('../../assets/image.png'), key: '3'}
  ];