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.