JavaScript React Components Managing State and Data Flow Adding Items to State

Umidjon Khaitov
Umidjon Khaitov
8,662 Points

Text field is not getting cleared up after Submit event

I think here is the main part which should clear up input field. Other than that I'm kinda lost, don't know how to find this bug. I tried to console log(this.setState({ value: ''})) as a last statement in this function, it says undefined.

handleSubmit = (e) => {
    e.preventDefault();
    this.props.addPlayer(this.state.value);
    this.setState({ value: ''});
  }
Dom Ss
Dom Ss
4,337 Points

Try console log the value like this in the render method.

render () {
        console.log(this.state.value, 'value')
        return (`

Also double-check your :

state = {
        value: ''
    };

I saw some answers were people changed

state = {
        value: ''
    };

to

state: {
        value: ''
    };

and it worked. O.o

Make sure there are NO TYPOS in any of the "value" keyword. ;)

1 Answer

Edith Allison
Edith Allison
2,708 Points

Did you follow the code at around 7:15 minutes of the video? You need to change

    handleSubmit = (e) => {
        e.preventDefault();
        this.props.addPlayer(this.state.value); 
    }

to

    handleSubmit = (e) => {
        e.preventDefault();
        this.props.addPlayer(this.state.value); 
        this.setState({
            value: ''
        });
    }
Umidjon Khaitov
Umidjon Khaitov
8,662 Points

yeah you were right! thank you!