Question

我正在尝试使其成为一体，以便当我按Enter或如果我从某个元素失去焦点时，它会触发功能，但是当我按Enter时，它也会触发模糊事件。因此该函数被调用两次。只能调用一次。

<input v-on:blur="saveField('name')" keyup.enter="saveField('name')">

问题是我的saveField（）函数隐藏了该元素，同时触发了模糊事件。

我猜另一个问题是如何不必两次编写相同的函数调用。（干）。

Answer 1

您可以使用某种条件检查该值是否需要更新。避免触发两个事件似乎很复杂：

<div id="app">
  <input v-model="inputValue" type="text" @blur="save()" @keyup.enter="save()">
  <div v-for="saving in savings">
    {{ saving }}
  </div>
</div>

new Vue({
    el: '#app',
  data: {
    inputValue: '',
    savedValue: '',
    savings: []
  },
  methods: {
    save () {
        if (this.inputValue !== this.savedValue) {
        this.savings.push('Saving value ' + this.inputValue)
        this.savedValue = this.inputValue
      }
    }
  }
})

这是正在工作的JsFiddle：power set

Vue.js与Enter事件模糊-触发两者

1 个答案: