react native元件的結構和生命週期
可以理解為c++程式設計中的標頭檔案。
匯入引用包括匯入react native定義的元件、
api，以及自定義的元件。
元件的生命分為元件的定義和樣式。元件的定義有各種元件的組成結構、方法的定義。
元件樣式的定義可以直接在元件的定義中的style中定義。但是對於樣式複雜的元件需要元件樣式。
js執行所有
react native
應用的入口。應用的根元件應當通過
方法註冊自己，然後原生系統才可以載入應用的**包並且在啟動完成之後通過呼叫
來真正執行應用。
匯出是用module.exports語句宣告元件，讓元件可以被其他元件引用。可以理解為j**a中變數的宣告，宣告時並不分配記憶體空間。
乙個react native元件從它被
react native
框架載入，到最終被
react native
框架解除安裝，會經歷乙個完整的生命週期。
其函式原型為：
object getinitialstate()
這個函式將在react native元件被家在前呼叫一次。它的返回值會成為
this.state
的初始值。
其函式原型為：
object getdefaultprops()
這個函式在元件被建立時呼叫一次。它的返回值會成為this.props的初始值。在這之後，如果父元件指定了元件的
props
中的某些值，這些值將會與
this.props
的初始值合併，如果有相同的鍵，父元件指定的鍵將覆蓋初始值的鍵。
getdefaultprops()返回的任何複雜物件都將會在元件的各個例項間共享，而不是每個例項擁有乙個拷貝。
其函式原型為：
componentwillmount()
在react native元件的生命週期中，這個函式只會被執行一次。它在初始渲染（
render
函式被react native
框架呼叫執行）前被執行，當它執行之後，
render
函式會馬上被
react native
框架呼叫執行。如果在這個函式裡呼叫
setstate
函式改變了某些狀態機變數的值，
react native
框架不會執行渲染操作，而是等待這個函式執行完成後再執行初始渲染。
react native元件的子元件也有
componentwillmount
函式，並且會在父元件的
componentwillmount
函式之後被呼叫。
這個函式無引數並且不需要任何返回值。
如果開發者需要從本地儲存中讀取資料用於顯示，那麼在這個函式裡進行讀取是乙個很好的時機。
其函式原型為：
componentdidmount()
在react native元件的生命週期中，這個函式只會被執行一次。它在初始渲染執行完成後會馬上被呼叫。在
react native
元件生命週期的這個時間點之後，開發者可以通過子元件的引用來訪問、操作任何子元件。
react native
元件的子元件也有
componentdidmount
函式，並且會在父元件的
componentdidmount
函式之前被呼叫。
這個函式無引數並且不需要任何返回值。
如果react native應用需要在程式啟動顯示初始介面後從網路側獲取資料，那麼把從網路側獲取資料的**放在這個函式裡是乙個不錯的選擇。
其函式原型為：
componentwillreceiveprops(object nextprops)
react native元件的初始渲染執行完成後，當
react native
元件接收到新的
props
時，這個函式將被呼叫。這個函式接收乙個
object
引數，object
裡的是新的
props
。如果新的props會倒置介面重新渲染，這個函式將在渲染前被執行。在這個函式中，老的
props
可以通過
this.props
訪問，新的
props
在傳入的
object
中。如果在這個函式中通過呼叫
this.setstate
函式改變某些狀態機變數的值，
react native
框架不會執行對這些狀態機變數改變的渲染，而是等
componentwillreceiveprops
函式執行完成後一起渲染。
其函式原型為：
boolean shouldcomponentupdate(object nextprops, object nextstate)
react native元件的初始渲染執行完成後，當
react native
元件接收到新的
props
或者state
時，這個函式將被呼叫。這個函式接收兩個
object
引數，其中第乙個是新的
props
，第二個是新的
state
。這個函式需要返回乙個布林值，告訴
react native
框架針對這次改變，
react native
是否需要重新渲染本元件。如果次函式返回
false
，react native
將不會重新渲染本元件，相應的本元件的
componentwillupdate
和componentdidupdate
函式也不會被呼叫。
react native元件預設的
shouldcomponentupdate
函式總是返回
true
值。如果開發者遵從了「視狀態機變數為『不可變的常量』」這個開發規則，那麼開發者可以提供自己的
shouldcomponentupdate
，在函式中比較新老版本的
state
和props
，判斷是否需要進行重新渲染。
通過這個函式來阻止無必要的重新渲染，是提高react native應用程式效能的一大技巧。
其函式原型為：
componentwillupdate(object nextprops, object nextstate)
react native元件的初始渲染執行完成後，
react native
框架在重新渲染
react native
元件前會呼叫這個函式。開發者可以在這個函式中為即將發生的重新渲染做一些準備工作，但開發者不能在這個函式中通過
this.setstate
再次改變狀態機變數的值。如果需要改變，則在componentwillreceiveprops函式中進行改變。
其函式原型為：
componentdidupdate(object preprops, object prestate)
eact native元件的初始渲染執行完成後，
react native
框架在重新渲染
react native
元件後會呼叫這個函式。傳入的兩個引數是渲染前的
props
和state
。其函式原型為：
componentwillunmount()
在react native元件被解除安裝前，這個函式將被執行。這個函式沒有引數。
如果react native元件申請了某些資源或者訂閱了某些訊息，那麼需要在這個函式中釋放資源，取消訂閱。
React Native 元件集合
1 display 該屬性用來指定元素是否為伸縮容器 flex inline flex flex用於產生塊級伸縮容器 inline flex用於產生行級伸縮容器 2 flexdirection 該屬性指定主軸方向 row row reverse column column reverse row 預...
ReactNative元件匯出
如果對rn開發有一定的了解的話，就會發現，reactnative提供的元件不能完全滿足開發的需求，就需要自定義一些元件，那麼如何匯出全域性的自定義元件呢？元件匯出有兩種形式 開發者一般使用預設元件匯出 首先在專案下面新建乙個資料夾rn design rn design就是乙個自己的元件庫類似於rea...
react native引導畫面元件
rn viewpager ios android react native material design android import from rn viewpager 引入必要依賴元件，其餘元件自行引入 style 必須flex 1 style 自定義右側頭部按鈕 style style 跳過...