Create a Controlled Input - 'target' of 'undefined'

The program does exactly what it’s supposed to do, and the syntax seems to match all the examples I’ve found online, yet for some reason, the third text gives me a ‘Cannot read property ‘target’ of undefined’ error. What am I missing here?

Your code so far


class ControlledInput extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      input: ''
    };
    // change code below this line
    this.handleChange = this.handleChange.bind(this);
    // change code above this line
  }
  // change code below this line
  handleChange() {
    this.setState ({
      input: event.target.value});
    }
  // change code above this line
  render() {
    return (
      <div>
        { /* change code below this line */}
        <input type = "text" value = {this.state.input} onChange = {this.handleChange} />
        { /* change code above this line */}
        <h4>Controlled Input:</h4>
        <p>{this.state.input}</p>
      </div>
    );
  }
};

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36.

Link to the challenge:

Hi @Lamrock93, welcome to the forum.
The problem is that you forgot to put the event parameter in the definition of the handleChange function. Once you add it, it should work.

1 Like