React Forms
Set the Input's Initial State

Good! Any time that someone types or deletes in <input />, the .handleUserInput() method will update this.state.userInput with the <input />‘s text.

Since you’re using this.setState, that means that Input needs an initial state! What should this.state‘s initial value be?

Well, this.state.userInput will be displayed in the <input />. What should the initial text in the <input /> be, when a user first visits the page?

The initial text should be blank! Otherwise it would look like someone had already typed something.



Give Input a constructor function which takes a parameter of props and calls super(props) on its first line.

Then, still in the constructor, set state equal to this object:

{ userInput: '' }

Feel free to use the example code as a guide.


Next, at the end of the constructor, bind .handleUserInput() to the current value of this.

Folder Icon

Take this course for free

Already have an account?