CODEWITHSUNDEEP
reactjsreact-native
Yaron
Yaron

Reputation: 1965

React Native Event

I have a TextInput component that calls an 'OnChangeText' event :

<TextInput onChangeText={(text) => this.setState({zip:text})}/>

That works fine.

Now I want to change the call event to a function:

 <TextInput onChangeText={_handleTextChange}/>

_handleTextChange(event) {
       this.setState({zip: 
       event.nativeEvent.text});

  }

That doesn't work. I get the following error :

undefined is not an object (evaluating 'event.nativeEvent.text'

How do send the 'Event' object to _handleTextChange function?

Thanks, Yaron

Upvotes: 5

Views: 18318

Answers (1)

Shuhei Kagawa
Shuhei Kagawa

Reputation: 4777

onChangeText passes a string to your handler function instead of an Event.

class YourComponent {
   render () {
     // ...
     return <TextInput onChangeText={this._handleTextChange.bind(this)}/>;
   }

  _handleTextChange(text) {
     this.setState({zip: text});
  }
}

EDIT

If you want an Event instead of text string, you can use onChange instead of onChangeText.

class YourComponent {
   render () {
     // ...
     return <TextInput onChange={this._handleTextChange.bind(this)}/>;
   }

  _handleTextChange(event) {
     this.setState({zip: event.nativeEvent.text});
  }
}

Upvotes: 14

Related Questions