從移動開發的角度來說，iOS和Android都有自己的一些UI特性，所以react-native宣稱的寫一套程式碼就可以通用就是騙人的鬼話，實際開發中，你會發現很多控制元件在iOS和Android上展示的效果不一樣，或者有些屬性支援iOS不支援Android。react-native早期是隻支援iOS的，後來才支援的Android，所以直到現在react-native對iOS平臺的支援還是比Android平臺要友好。

UI方面

• 1.textinput元件預設會在輸入框中加一條線，很難看，實際開發中，需要設定underlineColorAndroid='transparent'屬性，去掉Android系統下預設的線。

• 2.由於iOS和android平臺自己的特性，導致同一個元件在iOS上能達到設計的UI效果，在android上有可能達不到效果，這種情況就需要使用import {元件原名 as 別名} from '元件來源'，引入同名的第三方元件，針對不同的平臺進行UI的效果展示。

• 3.react-native對iOS支援了陰影效果，Android沒有，這種情況下，只能找第三方元件進行支援，或者採用切圖的方式進行支援。

• 4.要實現毛玻璃效果，網上查了好多資料，都推薦react-native-blur這個庫，但是這個庫也是對iOS支援的很好，對Android就不是那麼友好。iOS端的支援元件巢狀的方式，而且不需要設定image的ref，就可以實現毛玻璃效果，而且毛玻璃下層的檢視可以動態展示（比如輪播圖）；Android的則不行，不能採用元件巢狀的方式，而且一定要設定圖片的ref，換言之，就是隻支援對一張靜態圖做毛玻璃效果。

• 5.對於鍵盤遮擋的處理，iOS和Android觸發的事件不一樣，所以需要針對不同的平臺進行單獨的處理。

• 6.當前元件的狀態的更新的時候，使用setstate()更新的時候，會導致原本應該顯示的Toast提示，不能顯示，這個時候應該在Toast顯示方法的回撥中進行state的重新整理。

方法支援的差異

實際開發的過程中，會發現有一些方法，針對iOS有效果，Android平臺上，執行結果卻不一樣，這種情況下，要麼再找一個兩端都支援的，要麼就是針對不同的平臺用不同的方法。

• 1.startWith()判斷字串的字首的，實際開發中的，發現在iOS平臺執行結果正確，Android運算結果不正確，列印資料，發現數據是正確的。於是就發現了startWith()
  對於android的http連結判斷不起作用,改用indexOf()這個包含字串的方法後，兩端的執行結果都正確了。

• 2.對於空格的刪除，在實際開發中，需要對使用者輸入賬號和密碼時，輸入的空格進行刪除。實際操作的時候發現，Android平臺下，無論你連續輸入多少個空格，只要使用者停下輸入，使用正則表示式過濾字串中的空格就能生效，實現刪除空格的效果；iOS平臺卻只能刪除一個空格，如果你連續輸入多個空格，中間會出現一個點，多餘的空格，正則表示式也不起效果。這一點打了iOS的臉啦。

redux框架的坑

redux框架採用狀態判斷的形式進行業務邏輯的處理。實際開發的工程中，一定要保證業務邏輯判斷的狀態不能有相同的情況，否則很出現一些靈異的bug。我在開發登入&註冊流程時，當時因為是不同的頁面，用的狀態的判斷是一樣的（註冊時的輸入驗證碼和忘記密碼時的輸入驗證碼，跳轉邏輯一樣）。由於redux的AppState狀態是全域性的，而且註冊到忘記這條線，走的是push頁面的方式。忘記密碼的時候，出現了push兩次輸入密碼框頁面的情況，找了好久，通過列印頁面的跳轉方式，才從這個坑，從裡面爬出來。

這個bug出現的原因是對redux這種全域性狀態機制不瞭解，沒有把已經入棧頁面的狀態判斷方法遮蔽掉，導致後面走忘記密碼的時候，註冊頁面的跳轉密碼框的狀態滿足的情況下，也進行了跳轉。

總結

使用react-native進行開發，你一定要做好隨時遇到坑的準備，時刻準備著去填坑。react-native開發的路很漫長，過了這山還有那山。