Create a Controlled Input question

[Voitash]

Hello,
Why do I need “value={this.state.input}” in the input element? It seems to work even without it.

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 value={this.state.input} onChange={this.handleChange}></input>
      { /* Change code above this line */}
      <h4>Controlled Input:</h4>
      <p>{this.state.input}</p>
    </div>
  );
}
};

Challenge: Create a Controlled Input

Link to the challenge:

freeCodeCamp.org

[jenovs]

Here I created a simple example: https://codepen.io/jenovs/pen/eYyojRQ?editors=0010
Try to spot the difference.

[Voitash]

Now I get it! Thank you!