一套才、React JSX基礎(chǔ)
1立肘、React.js和React Native關(guān)系
2、React Native原理
3猪狈、借鑒XHTML的一些規(guī)則/規(guī)范
（1）開始結(jié)束標(biāo)簽配對
<組件>ooxx
（2）無內(nèi)容組件標(biāo)簽寫為自封閉形式
<組件/>
（3）自定義屬性抛蚁，字符串應(yīng)使用雙引號陈醒，其他值用{}括起來
4、注意事項(xiàng)
（1）必須單一子節(jié)點(diǎn)
（2）空值自動忽略
（3）顯示和隱藏組件
（4）組件必須大寫字母開頭
（5）文本必須寫在Text組件內(nèi)
【1】React Native中文網(wǎng)
【2】
（6）注釋寫法比較特殊
（7）只能嵌入表達(dá)式瞧甩，不能是語句
二钉跷、初識React組件化開發(fā)
1、class/function都可以是“積木”（組件）
（1）class
class GoodMorning extends Component {
render() {
return(
Good Morning!
);
}
}
（2）function無狀態(tài)組件
const GoodMorning=()=>{
return (
Good evening
);
}
2肚逸、使用props定制“積木”（組件）
（1）class
class GoodMorning extends Component {
static defaultProps={
name: 'someBody',
};
static propTypes={
name：React.propTypes.string, ?//約定需要的類型
};
render() {
return(
{this.props.name}
);
}
}
（2）function無狀態(tài)組件
const GoodEvening=(props)=> {
return (
{props.name}
);
}
3爷辙、class內(nèi)成員變量寫法
4彬坏、動態(tài)列表與key
（1）根據(jù)數(shù)組動態(tài)生成多個組件一般使用map方法
注意，箭頭函數(shù)的返回值（有{}必須寫return）
（2）循環(huán)生成的組件需要有唯一的key值區(qū)分
注意膝晾，key值放在循環(huán)的直接容器上
5栓始、組件化開發(fā)舉例一
（1）代碼示例：
//第一部分：引入依賴
import React, {Component} from 'react'
import {
AppRegistry,
StyleSheet,
Text,
View,
TouchableOpacity
} from 'react-native'
//第二部分：定義組件
class App extends Component {
//組件默認(rèn)自帶屬性
state = {
likes:0,
}
//編寫onPress函數(shù)
onPress = ()=>{
const {likes}=this.state;
this.setState({
likes: likes+1i
});
}
//渲染
render() {
return(
{this.state.likes}
);
}
}
//第三部分：樣式表
const styles = StyleSheet.create ({
container: {
flex:1,
justifyContent: 'center',
alignItems:'center',
backgroundColor: '#f5fcff',
},
welcome: {
fontSize:20,
textAlign: 'center'
margin:10,
},
});
//第四部分：注冊組件
AppRegistry.registerComponent('App', ()=>App);
（2）總結(jié)
【1】萬物生長靠太陽，界面變化靠狀態(tài)state
【2】state的狀態(tài)修改不能直接修改血当，必須通過setState方法
【3】setState是異步操作幻赚，修改不能馬上生效
【4】每setState一次，調(diào)用一次render方法
