【REACT NATIVE 系列教程之四】重新整理組件RENDER(重新渲染)的三種方式詳解

本站文章均為  李華明Himi  原創,轉載務必在明顯處註明： 
轉載自【黑米GameDev街區】 原文連結:  http://www.himigame.com/react-native/2242.html

開發過遊戲的都應該很清楚，“刷屏”是多麼的重要。其實開發應用也如此，當組件的資料被修改後，如何及時更新群組件呈現出最新的資料與效果一樣至關重要。

那麼這裡Himi大概講三種常用的方式： this.setState()  【最為常用】

這是在事件處理函數中和請求回呼函數中觸發 UI 更新的主要方法。

一般情況下setState() 總是觸發一次重繪，除非在 shouldComponentUpdate() 中實現了條件渲染邏輯。如果使用可變的對象，但是又不能在 shouldComponentUpdate() 中實現這種邏輯，僅在新 state 和之前的 state 存在差異的時候調用 setState() 可以避免不必要的重新渲染。

舉例、程式碼片段如下：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26

constructor ( props ) { super ( props ) ; this . state = {                  myName : 'I am MyName!' , } ;   }   testFun ( ) {      this . setState ( { myName : '組件被重新整理了' } ) ; }     render ( ) {          . . . . . .          < TouchableHighlight            underlayColor = '#4169e1'            onPress = { this . testFun . bind (