event.target null in React event handler

Question

Given the following code:

var
  React = require("react")
;

class ControlText extends React.Component {
  constructor(props){
    super(props);
    this.state = {
      value: ""
    };
  }

  update() {
    console.log(event);
    this.setState({value: event.target.value});
  }

  render() {
    console.log(this.state);
    var value = this.state.value;
    return <input type="text" value={value} onChange={this.update.bind(this)} />
  }
}

module.exports = ControlText;

Every time I log the event object in update(), it returns an object with target: null, and this.state.value updates from "" to undefined. This code diverges very little from the example on the Forms docs, why can't I seem to get an event target?

Oleksandr T. · Accepted Answer · 2016-02-03 18:59:44Z

5

Add event(you can name it as you want not only event) argument to update method

update(event) {
       ^^^^^

Example

edited Feb 3, 2016 at 18:59

answered Feb 3, 2016 at 18:54

Oleksandr T.

77.6k17 gold badges177 silver badges145 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Jack Reid Over a year ago

Yep, oh my god what a stupid oversight. Will approve this answer in 9 mins.

Collectives™ on Stack Overflow

event.target null in React event handler

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related