kliping.pro
  • Docs
  • Directory
  • Colors
  • Typeset
Hooks
  • State7
  • Advanced6
  • Lifecycle16
    • useDebounceEffect
    • useDebounceFn
    • useDeepCompareEffect
    • useDeepCompareLayoutEffect
    • useEffectEvent
    • useEffectWithTarget
    • useInterval
    • useIsHydrated
    • useIsomorphicLayoutEffect
    • useMount
    • useThrottleEffect
    • useThrottleFn
    • useTimeout
    • useUnmount
    • useUpdate
    • useUpdateEffect
  • Browser21
  • Development1
  • Third-Party4
  • Libraries4

useDebounceEffect

PreviousNext

Efek yang menunggu perubahannya berhenti.

Tidak ada yang perlu dipasang.

Vue sudah menyediakan padanannya — watch + useDebounceFn. Halaman ini menjelaskan cara memakainya.

Dirangkai dari dua bagian yang sudah ada di registry ini:

ts
import { useDebounceFn } from '@/composables/use-debounce-fn'

const { run } = useDebounceFn(() => cari(kueri.value), 300)
watch(kueri, run)

Kalau yang dibutuhkan adalah nilainya yang tertunda, bukan efeknya, ada yang lebih ringkas: useDebounce.

ts
const kueriTertunda = useDebounce(kueri, 300)
// lalu pakai kueriTertunda di computed, watch, atau langsung di template
PrevioususePreviousNext useDebounceFn
Dirilis di bawah lisensi MIT. Ditulis ulang untuk Vue dari shadcn-vue, shadcn-ui-blocks, dan shadcn-hooks. Hak cipta © 2026 Kliping