摘要：傳給回調(diào)函數(shù)的里，包含一個(gè)觸摸事件參數(shù)。官網(wǎng)的版文檔中，和組件中都有屬性，這個(gè)屬性接收一個(gè)回調(diào)函數(shù)，函數(shù)原型是，在組件和的組件的時(shí)候觸發(fā)該事件，傳給回調(diào)函數(shù)的里，參數(shù)，其中的屬性為該組件的。

由于手機(jī)屏幕高度不定，做表單頁面時(shí)，外層通常加上ScrollView組件，使其能夠適應(yīng)屏幕進(jìn)行滾動(dòng)。業(yè)務(wù)需要里面放置多個(gè)TextInput組件。

出現(xiàn)的問題是，首次點(diǎn)擊focus TextInput，鍵盤彈出，然后想要點(diǎn)擊連續(xù)focus TextInput時(shí)，結(jié)果沒有focus，而是鍵盤收起，需要再次點(diǎn)擊TextInput 進(jìn)行focus。

               結(jié)果就是每次切換輸入框都需要點(diǎn)擊兩次。

這個(gè)問題使得app的體驗(yàn)差到了極點(diǎn)，飽受用戶吐槽。

保持鍵盤一直展開，然后點(diǎn)擊的時(shí)候，能夠判斷點(diǎn)擊的組件是否為TextInput，如果是則鍵盤不收起，否則鍵盤收起。

閱讀ScrollView的源碼可以發(fā)現(xiàn)，它有一個(gè)屬性keyboardShouldPersistTaps，默認(rèn)值為false，表示只要點(diǎn)擊當(dāng)前focus組件外的地方，都會(huì)引起鍵盤的收起。

這個(gè)是不能連續(xù)focus TextInput的原因，引起鍵盤收起后，還捕獲了點(diǎn)擊事件，使得focus失效。 所以我們應(yīng)該把ScrollView的這個(gè)屬性設(shè)置為 true，讓鍵盤一直保持彈出狀態(tài)。

它還有一個(gè)屬性keyboardDismissMode，是枚舉類型： 代表鍵盤在drag的時(shí)候是否收起

"none" 是默認(rèn)值，代表鍵盤一直展開

"on-drag" 代表 ScrollView拖動(dòng)的時(shí)候 鍵盤收起 在android下無效

"interactive" 翻譯過來是互動(dòng)的時(shí)候鍵盤收起

但是發(fā)現(xiàn)在android和ios下也沒什么效果

嘗試著用這個(gè)屬性去收起鍵盤，但是效果不好，并且不兼容android。

最終我們對ScrollView的操作是加上屬性 keyboardShouldPersistTaps = true

如何判斷點(diǎn)擊到的組件是TextInput ？

閱讀View的原文我們可以發(fā)現(xiàn)屬性 onStartShouldSetResponderCapture，這個(gè)屬性接收一個(gè)回調(diào)函數(shù)，函數(shù)原型是 function(evt): bool，在觸摸事件開始（touchDown）的時(shí)候，RN 容器組件會(huì)回調(diào)此函數(shù)，詢問組件是否要劫持事件響應(yīng)者設(shè)置，自己接收事件處理，如果返回 true，表示需要劫持，如果返回false，表示不劫持。

傳給回調(diào)函數(shù)的event里，包含一個(gè)觸摸事件參數(shù)nativeEvent。nativeEvent 的詳細(xì)內(nèi)容如下：

identifier：觸摸的 ID，一般對應(yīng)手指，在多點(diǎn)觸控的時(shí)候，用來區(qū)分是哪個(gè)手指的觸摸事件；

locationX 和 locationY：觸摸點(diǎn)相對組件的位置；

pageX 和 pageY：觸摸點(diǎn)相對于屏幕的位置；

timestamp：當(dāng)前觸摸的事件的時(shí)間戳，可以用來進(jìn)行滑動(dòng)計(jì)算；

target：接收當(dāng)前觸摸事件的組件 ID；

changedTouches：evt數(shù)組，從上次回調(diào)上報(bào)的觸摸事件，到這次上報(bào)之間的所有事件數(shù)組。因?yàn)橛脩粲|摸過程中，會(huì)產(chǎn)生大量事件，有時(shí)候可能沒有及時(shí)上報(bào)，系統(tǒng)用這種方式批量上報(bào)；

touches：evt 數(shù)組，多點(diǎn)觸摸的時(shí)候，包含當(dāng)前所有觸摸點(diǎn)的事件。
這里我們用到的是target屬性，它就代表點(diǎn)擊的組件ID。

  React-Native官網(wǎng)的0.28版文檔中，View和TextInput組件中都有屬性onLayout，這個(gè)屬性接收一個(gè)回調(diào)函數(shù)，函數(shù)原型是 function(evt)，在mount組件和layout的組件的時(shí)候觸發(fā)該事件，傳給回調(diào)函數(shù)的event里，參數(shù)nativeEvent，其中的target屬性為該組件的ID。

  所以可以在TextInput組件layout時(shí)，將他們的ID存放在數(shù)組中，然后判斷觸發(fā)事件的組件ID是否在數(shù)組中，來確定該組件時(shí)候?yàn)門extInput。
  
  React-Native官網(wǎng)的0.28版文檔中，View和TextInput組件中都有屬性onLayout，這個(gè)屬性接收一個(gè)回調(diào)函數(shù)，函數(shù)原型是 function(evt)，在mount組件和layout的組件的時(shí)候觸發(fā)該事件，傳給回調(diào)函數(shù)的event里，參數(shù)nativeEvent，其中的target屬性為該組件的ID。
  
  所以可以在TextInput組件layout時(shí)，將他們的ID存放在數(shù)組中，然后判斷觸發(fā)事件的組件ID是否在數(shù)組。
  
  0.28版本之前 TextInput組件沒有onLayout屬性，所以在0.28版本中TextInput沒有onLayout屬性，hack的方法是用View包裹TextInput，然后給View加onLayout屬性，

獲取到的是View的組件ID，調(diào)試發(fā)現(xiàn)，View里面的TextInput的ID是外層View的ID+1，通過這種方法獲取的TextInput的組件ID，在0.29以后的版本中，可以直接給TextInput加onLayout屬性了。

 react-native 中有dismissKeyboard模塊，用于設(shè)置鍵盤的收起，直接調(diào)用該模塊方法，即可收起鍵盤。

const dismissKeyboard = require("dismissKeyboard");
const inputComponents = [];
  
    _onStartShouldSetResponderCapture (event) {
        let target = event.nativeEvent.target;
        if(!inputComponents.includes(target)) {
            dismissKeyboard();
        }
        return false;
    }
 
    _inputOnLayout(event){
        inputComponents.push(event.nativeEvent.target);
    }