Add timer to reduce fetch.

This commit is contained in:
Edward Betts 2019-09-25 14:38:52 +01:00
parent fa75292e22
commit 22b8b212e5

View file

@ -1,6 +1,10 @@
var typingTimer;
var doneTypingInterval = 500;
var app = new Vue({ var app = new Vue({
el: '#app', el: '#app',
data: { data: {
prevTerms: '',
searchTerms: '', searchTerms: '',
hits: [], hits: [],
new_depicts: [], new_depicts: [],
@ -14,8 +18,12 @@ var app = new Vue({
this.hits = []; this.hits = [];
this.searchTerms = ''; this.searchTerms = '';
}, },
search(event) { run_search() {
var terms = this.searchTerms; var terms = this.searchTerms;
if (terms == this.prevTerms) {
return; // no change
}
this.prevTerms = terms;
if (terms.length < 3) { if (terms.length < 3) {
this.hits = []; this.hits = [];
return; return;
@ -28,6 +36,10 @@ var app = new Vue({
.then((data) => { .then((data) => {
vm.hits = data.hits; vm.hits = data.hits;
}) })
},
search(event) {
clearTimeout(typingTimer);
typingTimer = setTimeout(this.run_search, doneTypingInterval);
} }
}, },
}); });