react native - nativeEvent property?

Question

So im trying to wrap my head around react native and it does not look difficult.

My question is straight forward, what is the "e" object how do I use its properties such as "e.nativeEvent" and "e.nativeEvent.text", and in what situations?

I stumbled upon this object when I was testing TextInput's onChangeText and onBlur props.

As you can see below, I am able to pass an argument parameter called "value" in the onChangeText prop, to the callback handler. BUT when I tried to do the same with the onBlur, I ran into issues ( and I checked the documentation which did not mention anything about an argument being passed to the callback function handler, unlike the onChangeText).

So I found this question, which helped me figure out how to access the data in TextInput using the e.eventNative.text property.

  render(){
return(
  <View>
  <Text>indent</Text>
  <Text>indent</Text>

    <TextInput
      style={{height:60, backgroundColor: "#ededed"}} // must define a height for T.I in iOS
      placeholder="Enter Text"
      value={this.state.textValue}
      onChangeText={(value) => this.onChangeText(value)}
    />
    <Text>{this.state.textValue}</Text>

    {/* on submit editing, will find the callback function to transfer text
     when submitting button is pressed */}
    <TextInput
    style={{height:60, backgroundColor: "skyblue"}}
    placeholder="Enter Text"
    onBlur={(value) => this.onSubmit(value.nativeEvent.text)}

    />
    <Text>{this.state.textSubmitted}</Text>
  </View>
);

} }

Solution

onChangeText is a special event for TextInputs whose handler is passed the text of the TextInput as the initial argument (so 'value' = 'ev.nativeEvent.value' for other events).

The onBlur event doesn't have this feature. So you'll need to access the text of the TextInput like you are.