在 React Native 中访问静态/本地图像

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 }} />但对于静态图像，它不会发生。建议？

Answer 1

对于静态图像，您需要如下指定source

source={require('static_image_path_relative_current_directory')

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

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