vue.js - 创建动态搜索

Question

我目前正在使用 Vuetify 来创建一个数据表，我在输入时看到搜索，它会根据输入的内容过滤以缩小结果范围。我很好奇如何使用相同的搜索栏，所以当我按 Enter 时它实际上会获取值并使用相同的 axios 调用重建数据表，但将参数添加到 URL。我仍然希望能够在输入时过滤当前结果而不是按回车键。这可能吗？

总体而言，我试图在搜索时创建标签。用户可以按回车键，重建表格，但可以看到他们输入的值作为标签。还可以x退出并删除以恢复默认值。

标签： vue.jsvuetify.js

Answer 1

假设您有这样的搜索输入：

<v-text-field
          v-model="search"
          append-icon="search"
          label="Search"
          single-line
          hide-details
          v-on:keyup.enter="myFunction"
 ></v-text-field>

您可以像上面一样添加 v-on:keyup.enter，然后将您的功能放入 myFunction

在 myFunction 中，你可以说 this.search 来获取它的值，你可以用它做任何你想做的事情。