源图像 React Native答案

【问题标题】：Source Image React Native源图像 React Native
【发布时间】：2021-11-15 14:49:27
【问题描述】：

我想问大家。我想显示来自本地资产的图像，但来自对象响应 api 的文件名。我尝试了一些代码，但无法工作。大家帮帮我吗？下面是我尝试过的一些代码。我还向 mylocal 添加了图像，并且我的对象响应 api 已经与扩展名相同

<Image
   source={`../../../asset/images/Topup/${props.image}`}
   style={styles.GridImage}
   resizeMode="contain"
/>

<Image
   source={'../../../asset/images/Topup/' + ${props.image}}
   style={styles.GridImage}
   resizeMode="contain"
/>

<Image
   source={require(`../../../asset/images/Topup/${props.image}`)}
   style={styles.GridImage}
   resizeMode="contain"
/>

<Image
   source={require('../../../asset/images/Topup/' + ${props.image})}
   style={styles.GridImage}
   resizeMode="contain"
/>

【问题讨论】：

props.image 值是否与您的assets/images/Topup 文件夹中的图像匹配？
是的，我在我的资产中添加了一张图片@Moistbobo
props.image 是否也包含扩展名？例如 .png、.jpg 等
是的，这是示例 {"flagBadge": "PR", "id": "1", "imageFav": "phone.png", "image": "sa_topup_pulsa.png", “keyword”：“topPhone”，“nameEN”：“电话充值”，“nameIN”：“Pulsa”，“payeeCategory”：“17”，“payeeId”：“32”} @Moistbobo
感谢您将其包含在内，但您是否也可以编辑您的问题以包含它？作为评论阅读有点困难。

【解决方案1】：

像这样将图像作为道具传递
props.image 将等于 require('fullpath/to/image-without-variables')
像这样使用它
<Image source={props.image} .../>

【讨论】：

【解决方案2】：

在需要图像时不能使用变量。传递给 require 的参数必须是字符串文字。试试require('../../../asset/images/Topup/image_name.extension')。

【讨论】：

【解决方案3】：

尝试复制图片路径并粘贴

或

您可以将图像导入到值中，然后将值写入源中

import value from 'path your image';


<Image
   source={value}
   style={styles.GridImage}
   resizeMode="contain"
/>

【讨论】：

正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。