第一次react-native項(xiàng)目實(shí)踐要點(diǎn)總結(jié)
今天完成了我的第一個(gè)react-native項(xiàng)目的封包,當(dāng)然其間各種環(huán)境各種坑,同時(shí),成就感也是滿滿的。這里總結(jié)一下使用react-native的一些入門級(jí)重要點(diǎn)(不涉及環(huán)境)。注意:閱讀需要語法基礎(chǔ): ES6 、react 、JSX
我對(duì)react-native的理解簡而言之就是 :react的語法 + native的組件
組件的創(chuàng)建聲明
class HelloWorldApp extends Component {
constructor(props) { super(props); this.state = {
};
}
render() { return (
<Text>Hello world!</Text>
);
}
}
上面代碼定義了一個(gè)“類”,可以看到里面有一個(gè)constructor方法,這就是構(gòu)造方法,而this關(guān)鍵字則代表實(shí)例對(duì)象。當(dāng)你在其他的組件中調(diào)用這個(gè)組件時(shí),就會(huì)實(shí)例化這個(gè)“類”(即組件)。
注意:組件名需要大寫
組件的導(dǎo)出、引用與注冊(cè)
在ES6中,新增了import和export倆個(gè)關(guān)鍵字來導(dǎo)入導(dǎo)出模塊。react-native的組件也是采用的這倆個(gè)關(guān)鍵字。
倆種方式:
第一種:
導(dǎo)出:
export default class HelloWorldApp extends Component{
render() {
延伸閱讀
- ssh框架
2016-09-30
- 阿里移動(dòng)安全 [無線安全]玩轉(zhuǎn)無線電——不安全的藍(lán)牙鎖
2017-07-26
- 消息隊(duì)列NetMQ 原理分析4-Socket、Session、Option和Pipe
2024-03-26
- Selective Search for Object Recognition 論文筆記【圖片目標(biāo)分割】
2017-07-26
- 詞向量-LRWE模型-更好地識(shí)別反義詞同義詞
2017-07-26
- 從棧不平衡問題 理解 calling convention
2017-07-26
- php imagemagick 處理 圖片剪切、壓縮、合并、插入文本、背景色透明
2017-07-26
- Swift實(shí)現(xiàn)JSON轉(zhuǎn)Model - HandyJSON使用講解
2017-07-26
- 阿里移動(dòng)安全 Android端惡意鎖屏勒索應(yīng)用分析
2017-07-26
- 集合結(jié)合數(shù)據(jù)結(jié)構(gòu)來看看(二)
2017-07-26
學(xué)習(xí)是年輕人改變自己的最好方式