Sometimes, we want to clear an input value after form submit in a React component.
In this article, we’ll look at how to clear an input after form submit in a React component.
Clear an Input Value After Form Submit in a React Component
We can clear an input value after form submit in a React component.
To do that, we write:
onHandleSubmit(e) {
e.preventDefault();
const name = this.state.name;
this.props.searchByName(name);
this.setState({
name: ''
});
}
We call preventDefault
to stop the default submit behavior.
Then we get the name
from the state
which is what we inputted.
Then we call our search function.
And finally, we clear the input value by clearing the name
state by assigning it an empty string.
Conclusion
We can clear an input value after form submit in a React component.