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.

Take this course for free

Mini Info Outline Icon
By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.

Or sign up using:

Already have an account?