Add timer to reduce fetch.
This commit is contained in:
parent
fa75292e22
commit
22b8b212e5
|
@ -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);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue