How to call a function on append-icon click in Vuetify.js? : <p>I need the <code>append-icon="close"</code> to call <code>@click="clearSearch()"</code></p>

<p>Right now I'm implementing it with a dedicated button:</p>

<pre><code> &lt;v-text-field 
       v-model="search" 
       class="search" 
       label="search" 
       prepend-icon="search" 
       append-icon="close"&gt;
 &lt;/v-text-field&gt;    

 &lt;v-btn @click="clearSearch()"&gt;&lt;/v-btn&gt;
</code></pre>

<hr>

<ul>
<li>I've tried adding <code>append-icon-cb="clearSearch()"</code> but it doesn't work and I don't know why</li>
<li>I've also tried simply using <code>clearable</code>, it clears the input but all the elements stay "filtered". I don't know how <code>clearable</code> works but my <code>clearSearch()</code> method simply does: <code>clearSearch() {this.search = ""}</code> and it works, that's why I use the custom <strong>clear input</strong> method</li>
</ul>
