React Native，渲染本地图片答案

【问题标题】：React Native, render a local imageReact Native，渲染本地图片
【发布时间】：2015-11-03 05:32:06
【问题描述】：

我正在尝试在我的应用中添加图像，但它不起作用。下面，这是我的代码：

return(
    <View>
    <Text style={styles.text}>ABCDEFG</Text>
    <Image
        style={{width: 400, height: 400}}
        source={{uri: 'http://facebook.github.io/react/img/logo_og.png'}}/>

    <Image style={{width: 400, height: 400}} source={require('image!download')} />
    </View>
    );

文本正在显示。在其下方，正在显示 Facebook React 徽标。但是，我的下载图像没有显示出来。它是嵌入的，因为如果我将“下载”更改为“mypicture”或其他内容，刷新后，我会收到以下错误：需要未知模块“image！mypicture”。如果您确定该模块在那里，请尝试重新启动打包程序。

我已经重新启动了 XCode，甚至我的电脑。为了以防万一，我评论了 Facebook 徽标。我在三月份看到，人们在渲染图像时遇到了问题。有人有想法吗？我对 XCode 不熟悉。

谢谢你帮助我。

【问题讨论】：

你要渲染什么图片？一个已经下载，还是在文件系统中？

标签： xcode image render react-native

【解决方案1】：

如果您使用的是xcassets，请确保图像文件本身的名称与xcassets 部分中的名称相同。

所以在这种情况下......图像文件的名称也应该是download.png。确保您使用 Xcode 添加删除这些图像，因为它写入 JSON 文件，并且仅重命名文件系统上的文件不会更新该文件。

如果您仍然无法使用xcassets，您可以将图像放到某个组中的项目中，然后在 React Native 中通过文件名访问它们。你不需要需要xcassets，尽管它有一些好处（比如不同的分辨率管理）。

【讨论】：

The Docs 是一个很好的资源。特别是，有一张有用的图片可以指导您将图片添加到xcassets。