如何在Vue.js中延迟@keyup处理程序

Question

我的观点：

ns-input#filterName(type="text", v-model="filterName", @keyup="searchTimeOut()")

在我的vue代码中：

getUsers() {
   .
   .
   .
   API.users.index(params).then(blabla);
   .
   .
   .
},

searchTimeOut() {
  let timeout = null;
  clearTimeout(timeout);
  // Make a new timeout set to go off in 800ms
  timeout = setTimeout(() => {
    this.getUsers();
    console.log("hi")
  }, 800);
},

在我停止输入和800毫秒后，我只想呼叫getUsers()一次。现在，我每次写信都打电话给getUsers()。

Answer 1

在清除间隔之前删除this.timer值。这样做：

searchTimeOut() {  
    if (this.timer) {
        clearTimeout(this.timer);
        this.timer = null;
    }
    this.timer = setTimeout(() => {
        // your code
    }, 800);
}