MoreHook

Appearance

Return to top
On this page

useDebounceFn

处理防抖函数

Demo

source

data: 0.2563992696432984
点击 0 次

Usage

html
<template>
  <div>
    <div>data: {{ data }}</div>
    <button @click="run">点击更改 data</button>
  </div>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { useDebounceFn } from '@morehook/core'

const data = ref(0)

const { run } = useDebounceFn(
  () => {
    data.value = Math.random()
  },
  1000,
  true
)
</script>

Type Declarations

typescript
type Fn = (...params: any[]) => any
/**
 * 处理防抖函数
 * @param fn
 * @param delay 防抖间隔 (默认 1000)
 * @param firstTrigger 是否需要首次点击时立即触发(这里的首次指的并不是第一次，每当防抖时间过了都会刷新首次)
 * @returns
 */
export declare function useDebounceFn(
  fn: Fn,
  delay?: number,
  firstTrigger?: boolean
): {
  run: () => void
}

Source

Source • Demo • Docs