1. 建项目
react-native init AwesomeProject
2.跑项目
react-native run-android
pro:android nexus 5x 8.0 报错 无错误信息 ans:刷回6.0.1
3.写一行文字
class-render-return:
<Text>Hello React Native!</Text>
pro:class 名称与js名称需一致!需导入Text控件
4.写两行文字
<View>
<Text>Hello React Native01!</Text>
<Text>Hello React Native02!</Text>
</View>
pro:需导入View控件
5.给字加个绿颜色
<Text style={style.worldColor}>Hello world!</Text>
const style = StyleSheet.create({
worldColor: {
color: '#00ff00'
},
}
)
pro:需导入StyleSheet控件
6.这样 你的世界就绿了
import React, {Component} from 'react'; import {Text, View, StyleSheet} from 'react-native'; export default class App extends Component { render() { return ( <View> <Text style={style.worldColor}>Hello world!</Text> <Text style={style.reactColor}>Hello ReactNative!</Text> </View> ); } } const style = StyleSheet.create({ worldColor: { color: '#00ff00' }, reactColor: { color: '#ff0000' }, } )