VueJS 2 - KeyUp 不起作用

Question

我使用 Vuetify 生成输入字段：

<v-text-field
  label="Search"
  v-model="search"
  @keyup.enter="search()"
  required
></v-text-field>

我希望我可以键入 enter 以从此字段进行搜索：

search () {
  alert('test')
}

当我按下回车键时，这个方法没有执行...

Answer 1

请确保使用 developer console 进行调试，以便您可以查看收到的错误消息：

您在这里实际遇到的问题是您已将 search 声明为数据属性和作为 method，因此您应该会看到以下消息：

[Vue warn]: Method "search" has already been defined as a data property.

要解决此问题，请更改您的方法名称或您的数据属性名称：

new Vue({
  el: '#app',
  methods: {
    search() {
      alert('search')
    },
  },
  data: {
    searchTerm: ''
  }
})

你应该会发现它工作正常。

Answer 2

我遇到了同样的问题，一切正常，结果是我使用的浏览器有问题。

您可以尝试从不同的浏览器查看您的控制台，例如 Chrome.

也许这对某人有帮助；

VueJS 2 - KeyUp doesn't work