v-debounce
Published in
1 min readJun 26, 2017
Delay directive for search/filter inputs. Tip #28
For search and filter inputs, I like to delay the execution until the user pauses typing after 500ms, for example, because usually those actions are slow (remote request or processing intensive).
In this post, I explained how to achieve that using lodash.debounce. But as soon as you need for multiple inputs in your app, makes sense to create a custom component, or in this case a directive: v-debounce.
The idea is to capture the input "oninput" event, wait, then dispatch it as another event "onchange", this way I can capture using v-model.lazy.
