vue防抖节流，全局定义，使用

防抖和节流

• 防抖节流的作用都是用于防止函数被多次调用，
• 区别在于，如果一个用户一直触发这个函数，每次触发的间隔都小于wait，防抖的情况下只会调用一次，而节流的情况会每隔一段一段时间调用函数
• 防抖在间隔时间内被触发会重新计时，执行最后一次
• 节流在间隔时间内只执行一次，第一次

防抖方法

防抖在间隔时间内被触发会重新计时，执行最后一次

let timer=null
export function debouce(fn, time=1000){if(timer!=null){clearTimeout(timer)}timer=setTimeout(()=>{typeof fn==='function'&&fn.apply(this)},time)
}

节流

节流在间隔时间内只执行一次，第一次

let flag=false;
export const throttle=(fn,time=300)=>{if(flag) clearTimeout(timer)flag=truetimer=setTimeout(()=>{typeof fn==='function'&&fn().apply(this)flag=false},time)
}

main.js中全局引入

import {debouce, throttle} from "xx.js"Vue.prototype.$D = { debouce, throttle }

使用

@click="$D.debouce(()=>自己的方法名())"