@click-append-inner not working in vuetify 3 code

Question

I tried using '@click:append-inner="randomFunc"' to trigger a click event on the icon I appended internally in my 'v-text-field', but it did not work. Furthermore the cursor is not changing to a pointer on hover over the icon.

I tried based on the Vuetify.js3 documentation icon event.

         <v-text-field 
            variant="outlined" 
            density="compact" 
            append-inner-icon="mdi-plus-box"
            @click:append-inner="addSomething"
            >
         </v-text-field>

browser screen shot on:

Answer 1

Works flawlessly when I put it into a playground