How to get value in TextInput when calling onBlur?

Question

In React native, I want to pass the TextInput value to the onBlur event handler.

onBlur={(e) => this.validateText(e.target.value)}

e.target.value works for a simple response. But, in the reaction-native, e.target.value is undefined. What is the structure of event arguments available in a native-reaction?

Answer 1

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

Unfortunately, this does not work for multiline={true}. One hack is to keep the link to TextInputand access the text value through the _lastNativeTextcomponent property . For example (suppose you assigned your component a TextInputreference to "textInput"):

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

Answer 2

onEndEditing 'onBlur'

onEndEditing?: function , .

onBlur - , onEndEditing TextInput

onEndEditing

, .

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

Answer 3

A simple solution: In this case, the last value by the user will always be changed on your email client.

           validate = () => {
            const { email } = this.state
            console.log('Validating Email Here!', email)
           }

          <TextInput
           style={styles.input}
           placeholder='E-mail'
           onChangeText={email => this.setState({email})}
           onBlur={e => this.validate()}
         />