computedWithControl

v0.0.15testeddemo

A computed ref whose recomputation is driven only by an explicitly declared dependency `source`, plus a manual `.trigger()`. Built on `customRef` with a single `flush: 'sync'` watcher and a lazy `dirty` flag, so the getter is cached and only re-runs when the source changes or you trigger it — never on unrelated reactive reads. Also exposes `.peek()` (untracked read) and `.stop()` (detach the source watcher).

Source Tests

Examples

const source = ref(0);
const unrelated = ref('a');
// only recomputes when `source` changes, not when `unrelated` does
const result = computedWithControl(source, () => source.value + unrelated.value.length);

// manual control: recompute on demand
let counter = 0;
const value = computedWithControl(() => {}, () => counter);
counter = 10;
value.trigger(); // value.value is now 10

// writable computed with controlled dependency
const base = ref(1);
const doubled = computedWithControl(base, {
  get: () => base.value * 2,
  set: (v) => { base.value = v / 2; },
});

Demo

Loading demo…

Signatures

export function computedWithControl<T>(
  source: WatchSource | MultiWatchSources,
  fn: ComputedGetter<T>,
  options?: WatchOptions,
): ComputedRefWithControl<T>;

export function computedWithControl<T>(
  source: WatchSource | MultiWatchSources,
  fn: WritableComputedOptions<T>,
  options?: WatchOptions,
): WritableComputedRefWithControl<T>;

Type Parameters

T

Parameters

Parameter	Type	Default	Description
`source`	`WatchSource \| MultiWatchSources`	—	The dependency (or array of dependencies) that controls recomputation
`fn`	`ComputedGetter<T> \| WritableComputedOptions<T, T>`	—	A getter, or a `{ get, set }` object for a writable computed
`options`?	`WatchOptions<boolean>`	`{}`	Watch options forwarded to the internal watcher (`flush` defaults to `'sync'`)

Returns

ComputedWithControlRef<T>A computed ref extended with `trigger`/`peek`/`stop`