vue 防抖动函数

最新推荐文章于 2024-09-22 14:13:05 发布

原创最新推荐文章于 2024-09-22 14:13:05 发布 · 342 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue #防抖动 #debounce

vue 专栏收录该内容

15 篇文章

订阅专栏

该博客介绍了JavaScript中的防抖(debounce)函数实现，用于防止在短时间内连续调用同一函数。函数通过设置定时器确保在指定延迟时间内，如果连续触发，只会执行最后一次。此外，还探讨了如何将防抖函数应用于Vuex的mutations中，以优化组件内的状态更新，提高性能。

function debounce(func, delay=300) { //func为防快速调用的函数,delay为抖动间隔在多少毫秒之内将忽视（此处默认为300毫秒）
    let timer = null;
    return function (...args) {
        if (timer) {
            clearTimeout(timer);
        }
        timer = setTimeout(() => {
            func.apply(this,args);
        }, delay);
    }
}
// 这个函数可以放入vuex的mutations中，组件内使用时：this.$store.commit("debounce",func,delay);