如何在 Vuetify.js 中点击附加图标调用函数？

Question

我需要 append-icon="close" 来调用 @click="clearSearch()"

现在我正在用一个专用按钮来实现它：

  <v-text-field
       v-model="search"
       class="search"
       label="search"
       prepend-icon="search"
       append-icon="close">
 </v-text-field>

 <v-btn @click="clearSearch()"></v-btn>

---

• 我试过添加 append-icon-cb="clearSearch()" 但它不起作用，我不知道为什么
• 我也试过简单地使用 clearable ，它清除输入但所有元素都保持“过滤”状态。我不知道 clearable 是如何工作的，但我的 clearSearch() 方法只是： clearSearch() {this.search = ""} 并且我使用自定义的 输入 法为什么有效

原文由 Un1 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

解决了，这里是解决方案：

为避免该问题，您应该使用 : 符号绑定属性：

:append-icon-cb="clearSearch"

并且不要放 () 否则它将不起作用（如@Traxo所述）

原文由 Un1 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

使用 @click:append="clearSearch" ， :append-icon-cb 已弃用。 （ 来源）

原文由 wkornilow 发布，翻译遵循 CC BY-SA 4.0 许可协议