2016-08-02 162 views
3

當按下搜索按鈕解除鍵盤時,我想從TextInput獲得當前文本。爲了獲得文本,我使用onSubmitEditing,但只有在將returnKeyType設置爲'search'時才調用它。這是一段代碼片段。當鍵盤被解除時,onSubmitEditing被調用兩次

render() { 
    return (
     <View style={{flex:1, justifyContent:'center'}}> 
     <TextInput 
      style={{alignSelf:'stretch'}} 
      onChangeText={(searchInput) => this.setState({ searchInput }) } 
      placeholder='Search' 
      returnKeyType='search' 
      onFocus={() => console.log('onFocus')} 
      onBlur={() => console.log('onBlur')} 
      onChange={(event) => console.log('onChange text: ' + event.nativeEvent.text)} 
      onEndEditing={(event) => console.log('onEndEditing text: ' + event.nativeEvent.text)} 
      onSubmitEditing={(event) => console.log('onSubmitEditing text: ' + event.nativeEvent.text)} 
     /> 
     </View> 
    ); 
    } 

這種事只有在安卓(onSubmitEditing在iOS的調用一次)。另外onSubmitEditing在我使用RN 0.24時被調用一次,但在最新版本(0.30)中被調用兩次。這是預期的行爲?有沒有辦法通過按下搜索按鈕解除鍵盤鍵時文本一次?

+0

我遇到了反應原生0.30相同的行爲。 Android API 22 –

+0

任何對這個問題感興趣的人都可以在[here]中看到當前狀態(https://github.com/facebook/react-native/issues/10443) –

回答

1

使用textinput.blur解決這個問題

<TextInput 
    ref={component => this._textInput = component} 
    onSubmitEditing={this._onSubmitEditing.bind(this)} 
    onEndEditing={this._onPressSearch.bind(this)} 
    returnKeyType='search' 
    style={styles.inputText}/> 

    _onSubmitEditing(){ 
    this._textInput.blur(); 
    } 
    _onPressSearch(event){ 
    console.log(event.nativeEvent.text); 
    }