React Native - 如何使用图像组件中的uri加载本地图像？

Question

我知道我们可以加载本地图像：

 <Image source={require('folder/image.png')}/>

但我需要像这样加载图像：

 <Image source={{uri: 'folder/image.png'}}/>

它适用于网络图像，但它不适用于本地图像，甚至它不会对本地图像给出任何错误并且静默不显示图像。谁能告诉我如何使用 uri 属性加载本地图像？

原文由 Purple Bytes 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

如果您使用 Expo 来构建您的 React Native 应用程序，这可能会有所帮助：

1）安装世博资产： expo install expo-asset

1. 初始化并设置您的 imageUri：

 import {Asset} from 'expo-asset';

const imageURI = Asset.fromModule(require('../../assets/test.png')).uri;

3）在我的例子中，我需要它在 NativeBase 的缩略图上：

 <Thumbnail square source={{uri: imageURI}}/>

文档： https ://docs.expo.io/versions/latest/sdk/asset/

原文由 Colo Ghidini 发布，翻译遵循 CC BY-SA 4.0 许可协议