在 React Native 中访问 static/local 个图像

Question

在我的 React Native 项目文件夹中，我有包含组件的 src 文件，还有一些我想在 iOS 和 Android 中使用的图像。如果我使用这个：

<Image style={{ width: 200, height: 200 }} source={require('../images/camera.png')} />

然后图像加载完美。但是，图像标签中的源将在用户拍照时动态创建。此代码：

<Image style={{ width: 200, height: 200 }} source={{ uri: '../images/camera.png' }} />

不起作用。没有抛出错误，但没有显示图像。我确信我走在正确的轨道上，因为当我用道具 (<Image style={{ width: 200, height: 200 }} source={{ uri: this.props.image }} />) 替换源时，它将 return 由相机拍摄并使用相同代码存储在设备上的图像，但是对于它没有发生的静态图像。建议？

Answer 1

对于静态图片，您需要像下面这样指定 source

source={require('static_image_path_relative_current_directory')

仅对于远程和本地文件（非静态）我们需要在 source 中指定 uri，如下所示

source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}

在 React Native 中访问 static/local 个图像

Accessing static/local images in React Native

react-native

react-native-image