Javascript vue.js keyup、keydown事件落后一个字符

我正在使用keydown/keyup事件，它调用一个javascript函数，将输入框的值（以及事件的currentTarget字段的值）打印到控制台，我注意到它是一个字符。例如，如果我在输入框中键入hello，我只能在控制台中看到hell，直到我按下另一个键，然后看到hello，即使此时我已经键入了hello1。为什么会这样？这附近有没有什么东西

以下是HTML：

<input type="text" class="form__field" v-model="keywords" v-on:keyup.enter="queryForKeywords" v-on:keydown="queryForKeywords">

---

因为您需要依靠输入的

v-model

来更新

关键字

属性，所以在重新渲染Vue组件之前，该值不会更新

您可以在传递给的回调中访问更新后的

关键字值，如本例所示：


newvue({
el:“#应用程序”，
数据（）{
返回{关键字：“”
},
方法：{
QueryWorkyWords:函数（事件）{
这个.$nextTick（（）=>{
如果（this.keywords.length>2）{
log（“关键字值：”+this.keywords）；
}
});
}
}
})
目前公认的答案是针对旧版本的vue，在最新版本中，应使用@input，而不是keypress或keyup

真正的问题根本与vue.js无关
问题隐藏在
keydown
事件背后

因此，当事件激发时，输入值尚未更新


通常，
keydown
用于通知您按下了哪个键。您可以这样访问它：

document.addEventListener('keydown', logKey);

function logKey(e) {
  console.log(e.key)
}


作为解决方案，您可以使用
keyup
事件：

我的建议是使用using
：value
和
@input
事件

<input type="text" :value="keywords" @input="queryForKeywords">

在事件处理完成之前，currentTarget的值可能不会更新（因此可以调用event.preventDefault之类的内容）。您可能应该直接从事件中抓取字符并将其附加到currentTarget值。我正在考虑这样做，但我认为可能会有一个更优雅的解决方案。在Vue 2.6中。*您需要将“keydown”替换为“input”示例：@input=“queryworkeywords”这会起作用，但问题并不隐藏在Vue.js中，而是在输入值尚未更新时触发方法的keydown事件。
<input type="text" :value="keywords" @input="queryForKeywords">

  data: {
    keywords: ''
  },

  methods: {
     queryForKeywords(event) {
       const value = event.target.value
         this.keywords = value
       if (value.length > 2) {
            console.log("keywords value: " + this.keywords);
       }
    }
  }