React Native:无法加载图像
我编写了一个简单的iOS程序来使用React Native显示图像。React Native:无法加载图像
'use strict';
var React = require('react-native');
var {
Image
} = React;
var styles = React.StyleSheet.create({
base: {
height: 400,
width: 400
}
});
class SimpleApp extends React.Component {
render() {
return (
<Image
style={styles.base}
source={require('image!k')}
//source={{uri: 'http://news.xinhuanet.com/world/2015-05/09/127782089_14311512601821n.jpg'}}
/>
)
}
}
React.AppRegistry.registerComponent('SimpleApp',() => SimpleApp);
但我从iPad屏幕消息:
"Failed to print error:","'undefined' is not an object (evaluating 'stackString.split')"
当我修改代码,使用图像的URL
//source={require('image!k')}
source={{uri: 'http://news.xinhuanet.com/world/2015-05/09/127782089_14311512601821n.jpg'}}
我只得到一个红色的矩形边框。
当我使用另一个js文件时,一切正常,“Hello World”可以在iPad屏幕上显示。
'use strict';
var React = require('react-native');
var {
Text,
} = React;
class SimpleApp extends React.Component {
render() {
return (
<Text>Hello World</Text>
)
}
}
React.AppRegistry.registerComponent('SimpleApp',() => SimpleApp);
确保您使用的是最新版本的React Native。与之反应原生0.4.4以下工作:
本地图像
<Image
style={styles.base}
source={require('image!tabnav_settings')}
/>
另外,还要确保你添加你想用你的形象资产图像:
远程图像
<Image
style={styles.base}
source={{uri: 'http://i.stack.imgur.com/DfkfD.png'}}
/>
谢谢,它为我工作。 – Tirth
这也是一样的机器人。如果您将图像添加到可绘制文件夹,则可以动态使用它们。 –
@the_bluescreen反应原生0.27.2。在那个版本中,我们不再需要将图像放入drawable中。在开发中它工作正常,但在生产图像不加载?任何建议,将不胜感激谢谢 –
正如@potench在评论中指出的那样,使用.jpg扩展名加载静态图片目前没有工作。但如果你只是将你的JPG文件重命名为png,那么一切正常。 另请参见https://github.com/facebook/react-native/issues/521
网络''装载机现在只支持'png'从我可以告诉。 '静态加载图片时'jpg'支持[ref](https://github.com/facebook/react-native/blob/72c5e5d981a21ede12dcd76de5ca22a398c8bcaf/packager/packager.js#L203) 'source = {require( 'image'k')}'用于静态加载图像,将'k'更改为本地存储的图像名称,'require'会将您的图像base'64到应用程序 'source = {{uri:'http :// ...'}}'用于从网络加载图像,您正在加载一个看起来不受支持的jpeg - 尝试加载png代替 –
potench