Create a controlled input - why only onChange will not do it?

[chrome]

I dont get the following explanation. Why removing this.state.input from the input element will not do it? To me it seems state is updated even without it. So what?

Now your next step will involve creating an input box and trigger it when someone types anything. Luckily we have an event called onChange() to serve this purpose.
But this just won’t serve your purpose. Although you might feel that its working. So what’s happening here is text updates from the browser not the state. So to correct this we’ll add a value attribute and set it to this.state.input to the input element which will make the input get controlled by state.

Challenge: Create a Controlled Input

Link to the challenge:

freeCodeCamp.org

[kevinSmith]

Because we don’t want the browser to be automatically updating the field (what the user is seeing). We want to pass the control over to React so it knows what is happening. The value attribute tells the browser, “OK, don’t update the input, we’re going to tell you what value to use there.” Now React is controlling it so React knows what the value is and can control the output too.