Reset to Initial State with React Hooks : <p>I'm currently working on a signup form and the following is a snippet of my code:</p>

<pre><code>const Signup = () =&gt; {
    const [username, setUsername] = useState('')
    const [email, setEmail] = useState('')
    const [password, setPassword] = useState('')
    const [passwordConfirmation, setPasswordConfirmation] = useState('')

    const clearState = () =&gt; {
        setUsername('')
        setEmail('')
        setPassword('')
        setPasswordConfirmation('')
    }

    const handleSubmit = signupUser =&gt; e =&gt; {
        e.preventDefault()
        signupUser().then(data =&gt; {
            console.log(data)
            clearState() // &lt;-----------
        })
    }

    return &lt;JSX /&gt;
}

export default Signup
</code></pre>

<p>Each piece of state is used for a controlled input for the form.</p>

<p>Essentially what I want to do is after the user has successfully signed up, I want the state to go back to the initial state with the fields cleared.</p>

<p>It's quite imperative to manually set each piece of state back to empty strings in<code>clearState</code> I was wondering if there is a method or function that comes with React that resets the state back to its initial values?</p>
