作者:袁善恩芷恩 | 来源:互联网 | 2022-10-19 17:19
我正在使用带有远程数据的Vuetify自动完成功能,并且我想限制/消除API调用(当用户在自动完成功能中键入文本时,请等待500毫秒以调用API)。我怎样才能做到这一点?
我看到了有关该debounce-search
属性的Stack OverFlow帖子,但是对我来说不起作用,并且我也没有看到有关此属性的任何Vuetify文档。
1> tony19..:
您可以在执行API调用的函数中添加反跳。可以使用setTimeout
和来实现去抖动器clearTimeout
,以便延迟新的呼叫并取消任何未决的呼叫:
methods: {
fetchEntriesDebounced() {
// cancel pending call
clearTimeout(this._timerId)
// delay new call 500ms
this._timerId = setTimeout(() => {
this.fetch()
}, 500)
}
}
这样的方法可以被结合到观察者上search-input
的支柱v-autocomplete
:
演示