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);

来源

2015-05-09 Han Pengbo

网络''装载机现在只支持'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

确保您使用的是最新版本的React Native。与之反应原生0.4.4以下工作：

本地图像

<Image 
    style={styles.base} 
    source={require('image!tabnav_settings')} 
    />

另外，还要确保你添加你想用你的形象资产图像：

Xcode Images.xcassets

远程图像

<Image 
    style={styles.base} 
    source={{uri: 'http://i.stack.imgur.com/DfkfD.png'}} 
    />

来源

2015-05-26 19:50:38 peter

谢谢，它为我工作。 – Tirth

这也是一样的机器人。如果您将图像添加到可绘制文件夹，则可以动态使用它们。 –

@the_bluescreen反应原生0.27.2。在那个版本中，我们不再需要将图像放入drawable中。在开发中它工作正常，但在生产图像不加载？任何建议，将不胜感激谢谢 –

正如@potench在评论中指出的那样，使用.jpg扩展名加载静态图片目前没有工作。但如果你只是将你的JPG文件重命名为png，那么一切正常。另请参见https://github.com/facebook/react-native/issues/521

来源

2015-07-01 04:12:16

React Native：无法加载图像

回答

相关问题