How do I get the value in TextInput when onBlur is called?

In React Native, you can get the value of the TextInput from e.nativeEvent.text.

Unfortunately, this doesn't work for multiline={true}. One hack around this is to maintain a ref to your TextInput and access the text value through the _lastNativeText property of the component. For example (assuming you've assigned your TextInput component a ref of "textInput"):

onBlur={() => console.log(this.refs.textInput._lastNativeText)}


You should use the 'onEndEditing' method instead of the 'onBlur'

onEndEditing?: function Callback that is called when text input ends.

onBlur is a component function where onEndEditing is specific for TextInput

onEndEditing

This approach works for both multiline and single line.

<TextInput 
    onEndEditing={(e: any) => 
    {
        this.setState({textValue: e.nativeEvent.text})
    }
}/>

Tags:

React Native