I know Vue.js has functionality built in to debounce on an input field. I have created a slider that fires a method that does not use an input field though, and I was wondering if I can take advantage of the debounce functionality inside of a method.
Is it even possible to use this functionality outside of simply adding a debounce to an input? Or do I need to write my own functionality for this?
I've just tried doing something like this but it does not seem to work:
this.$options.filters.debounce(this.search(), 2000);
For anyone who is wondering on how to do this. I fixed this by using an awesome little snippet I found:
Attribute in my data
timer: 0
Debounce functionality
// clears the timer on a call so there is always x seconds in between calls
clearTimeout(this.timer);
// if the timer resets before it hits 150ms it will not run
this.timer = setTimeout(function(){
this.search()
}.bind(this), 150);
You are put this.search() execution result into debounce, try this:
var bufferSearch = Vue.options.filters.debounce(this.search.bind(this), 150);
bufferSearch();
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With