title: How can clear React Material AutoComplete selected label clear if state empty?
body: <p>I have a state :</p>
  <pre><code>  const [searchEntryNo, setSearchEntryNo] = useState('');
  </code></pre>
  <p>Then I have a function to clear state like that.</p>
  <pre><code>  const handleClear = () =&gt; {
      setSearchEntryNo('');
    };
  </code></pre>
  <p><em><strong>Then There React AutoComplete :</strong></em></p>
  <pre><code>           &lt;Autocomplete
                className={classes.searchBox}
                id=&quot;combo-box-demo&quot;
                size=&quot;small&quot;
                options={entryList}
                getOptionLabel={(option) =&gt; option}
                onChange={(event, newValue) =&gt; {
                  setSearchEntryNo(newValue);
                }}
                style={{ width: 300 }}
                renderInput={(params) =&gt; &lt;TextField {...params} variant=&quot;outlined&quot; 
                        placeholder=&quot;Searching&quot; size=&quot;small&quot; /&gt;}
              /&gt;
  </code></pre>
  <p><em><strong>Note: entryList is the a array state</strong></em></p>
  <p><em><strong>There is a button where handleClear() function fired the button click:</strong></em></p>
  <pre><code>&lt;Button onClick={handleClear}&gt; Clear &lt;/Button&gt;
  </code></pre>
  <p><em><strong>Now I want to clear selected label from AutoComplete Box after handleClear() fired.
  How can I solve the issue?</strong></em>
  Please Help me!!</p>
  <p><a href="https://i.stack.imgur.com/1gR03.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1gR03.png" alt="enter image description here" /></a></p>