Question

我有一个数组，其中包含文件夹中图像的路径，我正在尝试显示它，但是我遇到了问题

      { 
      myGroups.map((item, index)=>{
      return (
        <Card key={index} style={{marginBottom:30}}>
            <CardItem>
              <Left>
                <Thumbnail 
                onPress={()=>navigation.navigate('GroupPosts')}
                source={require(item.img)} />
 )
               })
             }

这是州

state = { 
myCreatedGroups: [ 
{ groupName: 'Group 1', about: 'sample', img:'../../assets/imgs/groups/1.jpg' }, 
{ groupName: 'Group 2', about: 'sample', img:'../../../assets/imgs/groups/2.jpg' }, 
{ groupName: 'Group 3', about: 'Sample', img:'../../../assets/imgs/groups/3.jpg' }, 
    ], 
}

Answer 1

尝试使用数组项中的require（...）：

{ 
  groupName: 'Group 1', 
  about: 'sample', 
  img: require('../../assets/imgs/groups/1.jpg') //key difference here
}

然后您将得到：

<Thumbnail source={item.img} />

从本地文件夹反应本地调用动态图像

1 个答案: