コンテンツへスキップ

watchDeep

カテゴリ
エクスポートサイズ
325 B
最終更新日
先週

{deep: true} を使用して値を監視するための簡略記法です。

使用方法

watch と似ていますが、{ deep: true } が使用されます。

ts
import { watchDeep } from '@vueuse/core'

const nestedObject = ref({ foo: { bar: { deep: 5 } } })

watchDeep(nestedObject, (updated) => {
  console.log(updated)
})

onMounted(() => {
  nestedObject.value.foo.bar.deep = 10
})

型宣言

typescript
export declare function watchDeep<
  T extends Readonly<WatchSource<unknown>[]>,
  Immediate extends Readonly<boolean> = false,
>(
  source: [...T],
  cb: WatchCallback<MapSources<T>, MapOldSources<T, Immediate>>,
  options?: Omit<WatchOptions<Immediate>, "deep">,
): WatchStopHandle
export declare function watchDeep<
  T,
  Immediate extends Readonly<boolean> = false,
>(
  source: WatchSource<T>,
  cb: WatchCallback<T, Immediate extends true ? T | undefined : T>,
  options?: Omit<WatchOptions<Immediate>, "deep">,
): WatchStopHandle
export declare function watchDeep<
  T extends object,
  Immediate extends Readonly<boolean> = false,
>(
  source: T,
  cb: WatchCallback<T, Immediate extends true ? T | undefined : T>,
  options?: Omit<WatchOptions<Immediate>, "deep">,
): WatchStopHandle

ソースコード

ソースコードドキュメント

コントリビューター

Anthony Fu
Anthony Fu
山吹色御守
jp-liu
Kyrie890514
Alex Liu
丶远方
Hammad Asif

変更ログ

v12.0.0-beta.1 2024/11/21
0a9ed - feat!: Vue 2サポートの削除、バンドルの最適化、クリーンアップ (#4349)
v11.0.0-beta.2 2024/7/17
0716d - fix: watch関数のオーバーロード宣言の統一 (#4043)
v10.1.0 2023/4/22
8f6a0 - feat(watch): watchImmediate および watchDeep がオーバーロードをサポート (#2998)
v10.0.0-beta.3 2023/4/12
e6e25 - fix(watchDeep,watchImmediate): コールバック関数の実行ロジックを修正 (#2951)
v10.0.0-beta.0 2023年3月14日
b4ec7 - feat(watch): watch のショートハンドを追加 (#2651)

MITライセンスの下でリリースされています。