VueJS 2 - KeyUp doesn't work

做~自己de王妃 提交于 2019-12-13 03:07:26

问题


I use Vuetify to generate input field with:

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

I want I can key up enter to search from this field:

search () {
  alert('test')
}

When I key up on enter key, this method doesn't executed...


回答1:


Make sure you use your developer console for debugging so you can see what error messages you are getting:

  • Windows: ctrl+shift+I

  • Mac: +Option+I

The problem you are actually having here is that you have declared search as a data property and as a method, so you should see the following message:

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

To fix this change you method name or your data property name:

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

And you should find it works fine.

Here's the JSFiddle: https://jsfiddle.net/er9wsfcy/




回答2:


I had the same issue and everything was in order, turns out the Browser that i was using was the one with issues.

You can try viewing your console from a different browser eg Chrome.

Maybe this might help someone;



来源:https://stackoverflow.com/questions/47485428/vuejs-2-keyup-doesnt-work

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!