Vue3实现防抖、单页面引入、全局引入、全局挂载

📅 发布时间:2026/7/7 23:09:25 👁️ 浏览次数:
Vue3实现防抖、单页面引入、全局引入、全局挂载
MENU代码实现单页面引入全局引入使用代码实现constdebounce(fn:any,delay:number){lettimer:anyundefined;return(item:any){if(timer)clearTimeout(timer);timersetTimeout(()fn(item),delay);}};exportdefaultdebounce;单页面引入// 防抖(单页面引用)importdebouncefrom../../../utils/debounce;全局引入main.tsimportAppfrom./App.vue;importdebouncefrom./utils/debounce;constappcreateApp(App);app.config.globalProperties.$debouncedebounce;使用htmlel-sliderv-modelsliderValuesizesmallshow-inputinputhandleScheduleInput/单页面使用lethandleScheduleInputdebounce((val:number){console.log(滑块: ,val);},1000*1);全局使用// 防抖(全局挂载)letselfgetCurrentInstance()?.appContext.config.globalProperties;lethandleScheduleInputself?.$debounce((val:number){console.log(滑块: ,val);},2000*1);