From ab25ec0749aec847ba5a504ad60d00c619d95f0f Mon Sep 17 00:00:00 2001 From: ZiF1R <48289887+ZiF1R@users.noreply.github.com> Date: Wed, 1 Dec 2021 12:11:11 +0300 Subject: [PATCH 1/4] Update reactivity-computed-watchers.md --- src/guide/reactivity-computed-watchers.md | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/src/guide/reactivity-computed-watchers.md b/src/guide/reactivity-computed-watchers.md index 8de5ce3f..16f87956 100644 --- a/src/guide/reactivity-computed-watchers.md +++ b/src/guide/reactivity-computed-watchers.md @@ -30,35 +30,35 @@ plusOne.value = 1 console.log(count.value) // 0 ``` -### Computed Debugging +### 算出プロパティのデバッグ -`computed` accepts a second argument with `onTrack` and `onTrigger` options: +`computed` は２つ目の引数及び `onTrack` と `onTrigger` オプションにアクセスする: -- `onTrack` will be called when a reactive property or ref is tracked as a dependency. -- `onTrigger` will be called when the watcher callback is triggered by the mutation of a dependency. +- `onTrack` はリアクティブプロパティまたリンクが依存関係として追跡する時にコールされる。 +- `onTrigger` はウォッチのコールバックが依存関係の変更上でトリガーされた時にコールされる. -Both callbacks will receive a debugger event which contains information on the dependency in question. It is recommended to place a `debugger` statement in these callbacks to interactively inspect the dependency: +両方のコールバックは依存情報を持つデバッグイベントを受け取ります。このコールバックにはインタラクティブに依存を確認ため `debugger` と言う表現を使う推奨します: ```js const plusOne = computed(() => count.value + 1, { onTrack(e) { - // triggered when count.value is tracked as a dependency + // count.valueを依存関係として追跡する場合にトリガーする debugger }, onTrigger(e) { - // triggered when count.value is mutated + // count.valueを変更される場合にトリガーする debugger } }) -// access plusOne, should trigger onTrack +// plusOneにアクセスされる場合にonTrackがトリガーする console.log(plusOne.value) -// mutate count.value, should trigger onTrigger +// count.valueを変更される場合にonTriggerがトリガーする count.value++ ``` -`onTrack` and `onTrigger` only work in development mode. +`onTrack` と `onTrigger` は開発モードのみに動作します。 ## `watchEffect` From fe833e9c8ca6f8e3492378a84b5d9abf11b6bdbb Mon Sep 17 00:00:00 2001 From: ZiF1R <48289887+ZiF1R@users.noreply.github.com> Date: Wed, 1 Dec 2021 15:15:28 +0300 Subject: [PATCH 2/4] Update reactivity-computed-watchers.md --- src/guide/reactivity-computed-watchers.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/guide/reactivity-computed-watchers.md b/src/guide/reactivity-computed-watchers.md index 16f87956..6c94f2dc 100644 --- a/src/guide/reactivity-computed-watchers.md +++ b/src/guide/reactivity-computed-watchers.md @@ -32,10 +32,10 @@ console.log(count.value) // 0 ### 算出プロパティのデバッグ -`computed` は２つ目の引数及び `onTrack` と `onTrigger` オプションにアクセスする: +`computed` は2つ目の引数及び `onTrack` と `onTrigger` オプションにアクセスする: - `onTrack` はリアクティブプロパティまたリンクが依存関係として追跡する時にコールされる。 -- `onTrigger` はウォッチのコールバックが依存関係の変更上でトリガーされた時にコールされる. +- `onTrigger` はウォッチのコールバックが依存関係の変更上でトリガーされた時にコールされる。 両方のコールバックは依存情報を持つデバッグイベントを受け取ります。このコールバックにはインタラクティブに依存を確認ため `debugger` と言う表現を使う推奨します: From b5a2dfec77e15ec61ea5ef13d1f4fe4348adc65d Mon Sep 17 00:00:00 2001 From: ZiF1R <48289887+ZiF1R@users.noreply.github.com> Date: Fri, 3 Dec 2021 22:53:49 +0300 Subject: [PATCH 3/4] Update reactivity-computed-watchers.md --- src/guide/reactivity-computed-watchers.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/guide/reactivity-computed-watchers.md b/src/guide/reactivity-computed-watchers.md index 6c94f2dc..b198fac4 100644 --- a/src/guide/reactivity-computed-watchers.md +++ b/src/guide/reactivity-computed-watchers.md @@ -32,7 +32,7 @@ console.log(count.value) // 0 ### 算出プロパティのデバッグ -`computed` は2つ目の引数及び `onTrack` と `onTrigger` オプションにアクセスする: +`computed` は 2 つ目の引数及び `onTrack` と `onTrigger` オプションにアクセスする: - `onTrack` はリアクティブプロパティまたリンクが依存関係として追跡する時にコールされる。 - `onTrigger` はウォッチのコールバックが依存関係の変更上でトリガーされた時にコールされる。 @@ -42,19 +42,19 @@ console.log(count.value) // 0 ```js const plusOne = computed(() => count.value + 1, { onTrack(e) { - // count.valueを依存関係として追跡する場合にトリガーする + // count.value を依存関係として追跡する場合にトリガーする debugger }, onTrigger(e) { - // count.valueを変更される場合にトリガーする + // count.value を変更される場合にトリガーする debugger } }) -// plusOneにアクセスされる場合にonTrackがトリガーする +// plusOne にアクセスされる場合に onTrack がトリガーする console.log(plusOne.value) -// count.valueを変更される場合にonTriggerがトリガーする +// count.value を変更される場合に onTrigger がトリガーする count.value++ ``` From afac932e79559f4bb9df4690b63f45b28d10be66 Mon Sep 17 00:00:00 2001 From: ZiF1R <48289887+ZiF1R@users.noreply.github.com> Date: Sat, 4 Dec 2021 18:49:53 +0300 Subject: [PATCH 4/4] Apply suggestions from code review Co-authored-by: kazuya kawaguchi --- src/guide/reactivity-computed-watchers.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/guide/reactivity-computed-watchers.md b/src/guide/reactivity-computed-watchers.md index b198fac4..8bcff836 100644 --- a/src/guide/reactivity-computed-watchers.md +++ b/src/guide/reactivity-computed-watchers.md @@ -34,8 +34,8 @@ console.log(count.value) // 0 `computed` は 2 つ目の引数及び `onTrack` と `onTrigger` オプションにアクセスする: -- `onTrack` はリアクティブプロパティまたリンクが依存関係として追跡する時にコールされる。 -- `onTrigger` はウォッチのコールバックが依存関係の変更上でトリガーされた時にコールされる。 +- `onTrack` はリアクティブプロパティまた ref が依存関係として追跡する時に呼び出される。 +- `onTrigger` はウォッチャのコールバックが依存関係の変更上でトリガーされた時に呼び出される。 両方のコールバックは依存情報を持つデバッグイベントを受け取ります。このコールバックにはインタラクティブに依存を確認ため `debugger` と言う表現を使う推奨します: