useThrottleWatch
useThrottleWatch 跟watch类似,可以控制函数在多次触发的节流。
基础用法
<template>
<div>Hello World! {{count}}</div>
<button @click="count++">Add</button>
</template>
<script setup lang="ts">
import { ref } from "vue";
const count = ref<number>(0);
import { useThrottleWatch } from "hooks-vue3";
useThrottleWatch(
count,
(newVal, oldVale) => {
console.log("newVal", newVal, oldVale);
},
{
wait: 1000,
}
);
</script>
API
useThrottleWatch(count,callback,options);
参数TS类型
import type { ThrottleSettings } from 'lodash-es';
import type {
WatchCallback,
WatchOptions,
WatchSource,
WatchStopHandle,
} from 'vue';
export interface DebounceOptions extends ThrottleSettings {
wait?: number;
}
function useThrottleWatch<T = any, Immediate extends Readonly<boolean> = false>(
source: T | WatchSource<T>,
cb: WatchCallback<T>,
options?: WatchOptions<Immediate> & DebounceOptions,
): WatchStopHandle
Last updated