Can not pass React: Create a Controlled Input

JavaScript
1

Hello every one) I wrote a program to pass the quiz , and it seems it works, but still can not pass , who can help to find what is wrong

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(event){
  this.setState(({
  input: event.target.value
}));
}
  // change code above this line
  render() {
    return (
      <div>
        { /* change code below this line */}
          <input  onChange={()=>{this.handleChange(event)}} value = {this.state.input}/>
        { /* change code above this line */}
        <h4>Controlled Input:</h4>
        <p>{this.state.input}</p>
      </div>
    );
  }
};
2

Hi there,

There seem to be too many () on this block:

this.setState(({
  input: event.target.value
}));
3

handleChange(event){
this.setState({
input: event.target.value
});
}

still can not pass

4

It seems the issue is with the onChange event handler.

- onChange={()=>{this.handleChange(event)}}
+ onChange={this.handleChange}

The official documentation has a section devoted to Handling Events which might be helpful to understand this pattern.

Hope this helps :crossed_fingers:

5

Thanks) it helps )))

1 Like