title: clear a form after posting a message in react
body: <p>When a user submits a message to the message board, The User input still remains after posting. What syntax can I implement that will clear the input fields upon submission?</p>
  <pre><code>import { Card, Container, Form, Button } from &quot;react-bootstrap&quot;;
  import Label from &quot;react-bootstrap/Card&quot;;
  import React, { useState } from &quot;react&quot;;
  
  
  export default function MessageForm({handleAddPost}) {
      const [formData, setFormData] = useState({
          photo: '',
          title: '',
          content: ''
      })
  
      function handleChange(evt) {
          setFormData({...formData, [evt.target.name]: evt.target.value});
      }
  
      function handleSubmit(e) {
          e.preventDefault();
          handleAddPost(formData);
      }
  
  
      return (
          &lt;Container&gt;
              &lt;Card className=&quot;text-center&quot; border=&quot;success&quot; style={{ width: '85vw' }}&gt;
                  &lt;Form size=&quot;sm&quot; autoComplete=&quot;off&quot; onSubmit={handleSubmit}&gt;
                      &lt;Label&gt;Title&lt;/Label&gt;
                      &lt;Form.Control size=&quot;sm&quot;
                          value={formData.title} name=&quot;title&quot;
                          onChange={e =&gt; handleChange(e)}
                          /&gt;
                      &lt;Label&gt;Message&lt;/Label&gt;
                      &lt;Form.Control size=&quot;sm&quot;
                          value={formData.content} name=&quot;content&quot;
                          onChange={e =&gt; handleChange(e)}
                          /&gt;
                      &lt;Button size=&quot;sm&quot; variant=&quot;success&quot; type=&quot;submit&quot;&gt;Add Post&lt;/Button&gt;
                  &lt;/Form&gt;
              &lt;/Card&gt;
          &lt;/Container&gt;
      );
  }
  </code></pre>