Cannot Read Property 'target' Of Undefined

In my render method I have component handleChange is following handleChange: function (e) { va

Solution 1:

The problem is that you are invoking the function in this line:

onChange={this.handleChange()}

All you have to do is simply pass the function as a value to onChange without invoking it.

onChange={this.handleChange}

When you use parenthesis you'd be invoking a function/method instead of binding it with an event handler. Compare the following two examples:

//invokes handleChange() and stores what the function returns in testA.const testA = this.handleChange()  

vs

//stores the function itself in testB. testB be is now a function and may be invoked - testB();const testB = this.handleChange 

Solution 2:

If you are passing event using an arrow function, you should try the following:

onChange={(e) => handleChange(e)}

Solution 3:

Simply do this

<DatePicker selected={this.state.startDate} onChange={this.handleChange}/>

It will pass the event param of the function automatically. The rest of your code is okay.

Solution 4:

You are executing function rather than passing it as a prop.

You need to change this,

onChange={this.handleChange()}

with this,

onChange={this.handleChange}

Solution 5:

Changing this onChange={this.handleChange} to this onChange={() => this.handleChange()} may also help if all the suggestions above don't work.