Vuetify：覆盖v文本字段的“追加”插槽时，使自定义图像可点击

Question

我只是想在append的{​​{1}}插槽中使用自定义图像。此外，我希望该图像是可单击的，但是单击该图像时不要将光标设置在文本字段上。

根据documentation，很容易使用材质设计图标来对此进行归档：

v-text-field

使用图像代替材质设计图标也很容易：

    <v-text-field
              :append-icon="mdi-map-marker"
              box
              clearable
              label="Message"
              type="text"
              @click:append="toggleMarker">
    </v-text-field>

但是我如何才能使该图像可点击，以使其像上面的 <v-text-field box clearable label="Message" type="text"> <template v-slot:append> <img width="24" height="24" src="my-image.png" > </template> </v-text-field> 代码行那样反应材料设计图标？