将图像名称从obj设置为源React Native [英] Set image name from obj to source React Native

问题描述

我有一个图像来源和Obj参数的问题.
在本地对象中，我有IMG_NAME: 'A.png'，如下所示:

我想将此值与

但是我知道require不支持连接，因此我决定向您询问有关解决此问题的最佳方法的问题.

I've a ploblem with image Source and Obj's parameter.
Inside the local object I have IMG_NAME: 'A.png' like so:

I would like concatenate this value with source like

but I know require doesn't support concatenate so I decided ask you this question about the best way to solve this problem.

我该如何解决此问题( 我的屏幕截图 )和错误图片(> 错误响应 )

How can I try to solve this problem (my solve screenshot), and error image (Error reponse)

推荐答案

我认为在图像组件中有4种使用动态源的简单方法:

1)您可以使用已经捆绑到应用程序中的图像:

I think there are 4 simple way to use a dynamic source in the Image Component:

1) You can use images that are already bundled into the app:

来自混合应用程序资源的图像
如果您要构建混合图像 应用程序(React Native中的某些UI，平台代码中的某些UI)，您可以 仍然使用已经捆绑在应用程序中的图像.

Images From Hybrid App's Resources
If you are building a hybrid app (some UIs in React Native, some UIs in platform code) you can still use images that are already bundled into the app.

对于通过Xcode资产目录或Android中包含的图像 可绘制的文件夹，使用不带扩展名的图像名称:

For images included via Xcode asset catalogs or in the Android drawable folder, use the image name without the extension:

< Image source={{uri: 'app_icon'}} style={{width: 40, height: 40}} />

对于Android资产文件夹中的图像，请使用asset:/方案:

For images in the Android assets folder, use the asset:/ scheme:

< Image source={{uri: 'asset:/app_icon.png'}} style={{width: 40, height: 40}} />

< Image source={{uri: 'asset:/app_icon.png'}} style={{width: 40, height: 40}} />

这些方法不提供安全检查.由您决定 这些图像在应用程序中可用.你也必须 手动指定图像尺寸.

These approaches provide no safety checks. It's up to you to guarantee that those images are available in the application. Also you have to specify image dimensions manually.

https://facebook.github.io/react-native/docs/images.html#images-from-hybrid-app-s-resources

2)您可以在对象中使用require('imagePath').

https ://facebook.github.io/react-native/docs/images.html#images-from-hybrid-app-s-resources

2) You can use require('imagePath') into the object.

{
  "id_letter": "1",
  "name_letter":"A",
  "img_name":require('./app/assets/images/imgname.jpg');
}

3)您可以将图像存储在网络中，并且可以使用:

3) You can storage the images in the web and you can use:

<Image source={{uri: 'http: //site.com/app/assets/images/'+data.img_name}}/>

4)您可以使用库 https://github.com/wkh237/react-native-fetch-blob .

4) You can storage the images using the library https://github.com/wkh237/react-native-fetch-blob.

这篇关于将图像名称从obj设置为源React Native的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！