CODEWITHSUNDEEP
reactjstypescriptreact-reduxreact-dom
Chief
Chief

Reputation: 963

Get event object in react forms after onChange is called

Up and running with react but have come across a few blockers especially with the forms.

When I pass in a method or function onChange and pass in the event to my callback. Getting all sorts of result as shown in the images below:

so here is my method implemented as part of a class which extends React.Component. enter image description here

This is what i get in the console when I enter some values in the input enter image description here

What is going on here exactly?

I was expecting the "events" param to be the event object so I can access the target but instead events is the value I entered in the input.

All along I was interested in retrieving the event object but ended up getting the value every time.

If I want to work with the event object onChange of an element how do I go about it? Take for example in Angular there is the $event

Upvotes: 2

Views: 163

Answers (2)

ghazouan badr
ghazouan badr

Reputation: 486

first you should bind your handleInput method in your constructor like below 

this.handleInput = this.handleInput.bind(this).

and

handleInput: (event) => {

  console.log("event ", event)
  console.log("value ", event.target.value)

}

Upvotes: 0

Antoni
Antoni

Reputation: 1433

You get your input values with event.target.value.

handleInput: (event) => {
  const { name, value } = event.target

  console.log(name, value)
}

Upvotes: 1

Related Questions