vueuse
diff --git a/Collapse file
‎packages/shared/whenever/index.test.ts‎
Copy file name to clipboardExpand all lines: packages/shared/whenever/index.test.ts
+39Lines changed: 39 additions & 0 deletions b/Collapse file
‎packages/shared/whenever/index.test.ts‎
Copy file name to clipboardExpand all lines: packages/shared/whenever/index.test.ts
+39Lines changed: 39 additions & 0 deletions
diff --git a/Collapse file
‎packages/shared/whenever/index.ts‎
Copy file name to clipboardExpand all lines: packages/shared/whenever/index.ts
+8-4Lines changed: 8 additions & 4 deletions b/Collapse file
‎packages/shared/whenever/index.ts‎
Copy file name to clipboardExpand all lines: packages/shared/whenever/index.ts
+8-4Lines changed: 8 additions & 4 deletions
@@ -102,4 +102,43 @@ describe('whenever', () => {
 
     vm.unmount()
   })
+
+  it('immediate', async () => {
+    const vm = useSetup(() => {
+      const number = shallowRef<number | null>(null)
+      const lazyWatchCount = shallowRef(0)
+      const eagerWatchCount = shallowRef(0)
+
+      whenever(number, (value, prevValue) => {
+        lazyWatchCount.value++
+        expectType<number>(value)
+        expectType<number | null>(prevValue)
+      }, { immediate: false })
+
+      whenever(number, (value, prevValue) => {
+        eagerWatchCount.value++
+        expectType<number>(value)
+        expectType<number | null | undefined>(prevValue)
+      }, { immediate: true })
+
+      const changeNumber = (v: number) => number.value = v
+
+      return { number, lazyWatchCount, eagerWatchCount, changeNumber }
+    })
+
+    expect(toValue(vm.lazyWatchCount)).toBe(0)
+    expect(toValue(vm.eagerWatchCount)).toBe(0)
+
+    vm.changeNumber(1)
+    await nextTick()
+    expect(toValue(vm.lazyWatchCount)).toBe(1)
+    expect(toValue(vm.eagerWatchCount)).toBe(1)
+
+    vm.changeNumber(2)
+    await nextTick()
+    expect(toValue(vm.lazyWatchCount)).toBe(2)
+    expect(toValue(vm.eagerWatchCount)).toBe(2)
+
+    vm.unmount()
+  })
 })
@@ -1,7 +1,9 @@
-import type { WatchCallback, WatchOptions, WatchSource } from 'vue'
+import type { WatchCallback, WatchHandle, WatchOptions, WatchSource } from 'vue'
 import { nextTick, watch } from 'vue'
 
-export interface WheneverOptions extends WatchOptions {
+type Truthy<T> = T extends false | null | undefined ? never : T
+
+export interface WheneverOptions<Immediate = boolean> extends WatchOptions<Immediate> {
   /**
    * Only trigger once when the condition is met
    *
@@ -17,14 +19,16 @@ export interface WheneverOptions extends WatchOptions {
  *
  * @see https://vueuse.org/whenever
  */
-export function whenever<T>(source: WatchSource<T | false | null | undefined>, cb: WatchCallback<T>, options?: WheneverOptions) {
+export function whenever<T>(source: WatchSource<T>, cb: WatchCallback<Truthy<T>, T | undefined>, options?: WheneverOptions<true>): WatchHandle
+export function whenever<T>(source: WatchSource<T>, cb: WatchCallback<Truthy<T>, T>, options?: WheneverOptions<false>): WatchHandle
+export function whenever<T, Immediate extends Readonly<boolean> = false>(source: WatchSource<T>, cb: WatchCallback<Truthy<T>, T | undefined>, options?: WheneverOptions<Immediate>) {
   const stop = watch(
     source,
     (v, ov, onInvalidate) => {
       if (v) {
         if (options?.once)
           nextTick(() => stop())
-        cb(v, ov, onInvalidate)
+        cb(v as Truthy<T>, ov, onInvalidate)
       }
     },
     {