文本輸入

允許用戶(hù)輸入文本的基礎(chǔ)組件——TextInput，詳細(xì)文檔地址
有兩個(gè)監(jiān)聽(tīng)事件屬性—— onChangeText (監(jiān)聽(tīng)文本變化)、onSubmitEditing（監(jiān)聽(tīng)提交文本事件，體現(xiàn)在手機(jī)上就是用戶(hù)按下軟鍵盤(pán)上的提交鍵）

export default class BlinkApp extends Component {
    state = {text:''};
    render(){
        return(
            <View>
                <TextInput
                    style={{height:40}}
                    placeholder="Type here to translate!"
                    onChangeText={(text)=>{this.setState({text})}}
                    onSubmitEditing={(t)=>{alert(t.nativeEvent.text)}}
                    value={this.state.text}
                />
                <Text style={{padding: 10, fontSize: 42}}>
                    {this.state.text.split(' ').map((word)=> word&&'pika').join(' ')}
                </Text>
            </View>
        )
    }
}

觸摸事件

React Native提供了可以處理常見(jiàn)觸摸手勢(shì)的組件 以及可用于識(shí)別更復(fù)雜手勢(shì)的完整的手勢(shì)響應(yīng)系統(tǒng)

跨平臺(tái)的按鈕組件——button，默認(rèn)情況在 iOS 上渲染一個(gè)藍(lán)色的標(biāo)簽狀按鈕，在 Android 上則會(huì)渲染一個(gè)藍(lán)色圓角矩形帶白字的按鈕。

<Button
   onPress={() => {
    Alert.alert("你點(diǎn)擊了按鈕！");
  }}
  onLongPress
  title="點(diǎn)我！"
/>

Touchable系列組件

• TouchableHighlight
  用來(lái)制作按鈕或鏈接，組件會(huì)在用戶(hù)手指按下時(shí)變暗

• TouchableOpacity
  在用戶(hù)手指按下時(shí)降低按鈕的透明度

• TouchableWithoutFeedback
  處理點(diǎn)擊事件的同時(shí)，不顯示任何視覺(jué)反饋

• TouchableNativeFeedback
  在Android上，會(huì)在用戶(hù)手指按下時(shí)形成類(lèi)似墨水漣漪的視覺(jué)效果。