JavaScript - 添加图像：反应本机XCode

Question

我想知道如何去插入图像到这？

我也想知道这是JavaScript实现的CSS还是实现在JavaScript中的CSS？

它是自动生成的阵营本土作为默认的应用程序启动器包，我们刚开的基本知识交手...

import React, { 
    AppRegistry, 
    Component, 
    StyleSheet, 
    Text, 
    View 
} from 'react-native'; 


class VLDB extends Component { 
    render() { 
    return (
     <View style={styles.container}> 
     <Text style = {styles.welcome}> 
     VLDB SQL Cheat Sheet! 
     </Text> 
     <Text style={styles.welcome}> 
      Welcome to the SQL Cheat Sheet! 
     </Text> 
     <Text style={styles.instructions}> 
      To get started, edit index.ios.js 
     </Text> 
     <Text style={styles.instructions}> 
      Press Cmd+R to reload,{'\n'} 
      Cmd+D or shake for dev menu 
     </Text> 
     </View> 
    ); 
    } 
} 


const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    justifyContent: 'center', 
    alignItems: 'center', 
    backgroundColor: '#F5FCFF', 
    }, 
    welcome: { 
    fontSize: 20, 
    textAlign: 'center', 
    margin: 10, 
    }, 
    instructions: { 
    textAlign: 'center', 
    color: '#333333', 
    marginBottom: 5, 
    }, 
}); 


AppRegistry.registerComponent('VLDB',() => VLDB); 

干杯，卢克。

Answer 1

将图像添加到这一点，首先需要在图像成分

import React, { 
    AppRegistry, 
    Component, 
    Image, 
    StyleSheet, 
    Text, 
    View 
} from 'react-native'; 

然后添加的图像为通过引用本地捆绑图像或像这样的远程图像中the documentation描述进口。 ..

class VLDB extends Component { 
    render() { 
    return (
     <View style={styles.container}> 
     <Image 
      style={styles.icon} 
      source={require('./myIcon.png')} 
      /> 
     <Image 
      style={styles.logo} 
      source={{uri: 'http://facebook.github.io/react/img/logo_og.png'}} 
      /> 
     <Text style = {styles.welcome}> 
     VLDB SQL Cheat Sheet! 
     </Text> 
     <Text style={styles.welcome}> 
      Welcome to the SQL Cheat Sheet! 
     </Text> 
     <Text style={styles.instructions}> 
      To get started, edit index.ios.js 
     </Text> 
     <Text style={styles.instructions}> 
      Press Cmd+R to reload,{'\n'} 
      Cmd+D or shake for dev menu 
     </Text> 
     </View> 
    ); 
    } 
}