一、展示图片资源
3.编辑index.android.js文件,像如下方式引用它;
Index.android.js文件
import React,{ … … } from 'react-native'; class AwesomeProject extends Component { render() { var icon = false ? require('./img/my-icon-active.png') : require('./img/my-icon-inactive.png'); // 错误 //var icon = this.props.active ? 'my-icon-active' : 'my-icon-inactive'; return ( <View> //静态资源 <Image style={styles.img} source={require('./img/my-icon-active.png')}/> <Image style={styles.img} source={icon} /> //错误:require中的图片名字必须是一个静态字符 //<Image source={require('./' + icon + '.png')} /> //混合资源,使用已将打包到App中的图片资源 <Image style={styles.img} source={{uri:'my-icon-active.png'}} /> //网络资源,需要手动的指定图片的尺寸 <Image source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}} style={{width: 400,height: 400}} /> </View> ); } } var styles = StyleSheet.create({ img:{ … … },}); AppRegistry.registerComponent('AwesomeProject',() => AwesomeProject);4.运行效果如下: