當模態打開時，如何將焦點設置在模態內部的第一個 TouchableHighlight 組件（或另一個，例如由 ref 給出）上？

Question

如何在打開模式時將焦點設置到模式內的第一個（或任何給定的）TouchableHighlight 組件？ 我正在使用方向鍵/kayboard/電視遙控器

讓我們使用 react-native 文檔模式示例的片段：

<View style={{marginTop: 22}}>
  <Modal
    animationType="slide"
    transparent={false}
    visible={this.state.modalVisible}
    onRequestClose={() => {
      Alert.alert('Modal has been closed.');
    }}>
    <View style={{marginTop: 22}}>
       <View>
          <TouchableHighlight>
            <Text>Button 1</Text>
          </TouchableHighlight>
          <TouchableHighlight>
            <Text>Button 2</Text>
          </TouchableHighlight>
          <TouchableHighlight
             onPress={() => {     
           this.setModalVisible(!this.state.modalVisible);
             }}>
             <Text>Hide Modal</Text>
           </TouchableHighlight>
        </View>
     </View>
  </Modal>
  <TouchableHighlight
     onPress={() => {
       this.setModalVisible(true);
     }}>
     <Text>Show Modal</Text>
  </TouchableHighlight>
</View>

使用 D-pad 進行導航可以工作，但是當打開模式時，第一個 TouchableHighlight（按鈕 1）沒有聚焦，焦點仍然在“顯示模式”按鈕上，或者，如何以編程方式將焦點設置在“按鈕 2”TouchableHighlight 上？

例如 TextInput 有 autoFocus，但 TouchableHighlight 沒有，如果我們在模態中只使用 Touchable 組件，我不知道如何自動聚焦它們，或者隱式設置它

此致

Answer 1

將hasTVPreferredFocus: true添加到您想要聚焦的hasTVPreferredFocus: true 。

盡管文檔指出 hasTVPreferredFocus 僅適用於 iOS，但它還是在 Android 上實現的。

以編程方式，您還可以通過調用強制焦點：

yourElementRef.setNativeProps({ hasTVPreferredFocus: true })

Answer 2

initialRef.current.setNativeProps({hasTVPreferredFocus: true});

Answer 3

@mtkopone 。 有什么方法可以聚焦View組件，我在 View 中有一個列表，我想在用戶聚焦該 View 時執行一些函數調用（onFocus、onBlur）