ref-debounced

Readonly ref that follows source after it stayed quiet for waitMs.

Minimal setup

Use a Vue 3.5+ project with Vue SFC compilation configured (see Vite+ integration).

vp install @vizejs/composable

Import the entry directly. Call lifecycle-bound utilities inside <script setup> so cleanup follows the component scope; consult the runtime contract for this entry's SSR and hydration behavior.

import { refDebounced } from "@vizejs/composable/ref-debounced";

Runtime contract

API

refDebounced

Readonly ref that follows source after it stayed quiet for waitMs. Shorthand for useDebounced(source, waitMs, options).debounced when the pending flag and cancel/flush controls are not needed. Inherits every rule of useDebounced: synchronous mirroring on the server, reactive wait, and scope-bound cleanup.

function refDebounced<Value>( source: MaybeRefOrGetter<Value>, waitMs: MaybeRefOrGetter<number>, options: UseDebouncedOptions = {}, ): Readonly<ShallowRef<Value>>

const query = ref("");
const debouncedQuery = refDebounced(query, 300);