File tree 1 file changed +4
-4
lines changed
1 file changed +4
-4
lines changed Original file line number Diff line number Diff line change @@ -35,7 +35,7 @@ function Example() {
35
35
36
36
このスニペットは [ 1 つ前のページのカウンターの例] ( /docs/hooks-state.html ) に基づいていますが、新しい機能をひとつ加えてあります。クリック回数を含んだカスタムのメッセージをドキュメントのタイトルにセットしているのです。
37
37
38
- データの取得、購読の設定、あるいは React コンポーネント内の DOM の手動での変更、といったものはすべて副作用の例です。これらを "副作用 (side-effect)"(あるいは単に "作用 (effect)")と呼ぶことに慣れているかどうかはともかくとしても、これらのようなことをコンポーネントに対して行ったことはあるでしょう 。
38
+ データの取得、購読の設定、あるいは React コンポーネント内の DOM の手動での変更、といったものはすべて副作用の例です。これらを "副作用 (side-effect)"(あるいは単に "作用 (effect)")と呼ぶことに慣れているかどうかはともかくとしても、これらのようなことをコンポーネントの中で行ったことはあるでしょう 。
39
39
40
40
> ヒント
41
41
>
@@ -143,7 +143,7 @@ function Example() {
143
143
144
144
## クリーンアップを有する副作用
145
145
146
- ここまでに、クリーンアップを必要としない副作用の表現のしかたについて見てきました。しかし幾つかの副作用ではそれが必要です。例えば何らかの外部のデータソースへの**購読をセットアップしたい**ことがあります。そのような場合、メモリーリークが発生しないようにクリーンアップが必要です ! クラスの場合とフックの場合とでクリーンアップをどのように行えるのか比較しましょう。
146
+ ここまでに、クリーンアップを必要としない副作用の表現のしかたについて見てきました。しかし幾つかの副作用ではそれが必要です。例えば何らかの外部のデータソースへの**購読をセットアップしたい**ことがあります。そのような場合、メモリリークが発生しないようにクリーンアップが必要です ! クラスの場合とフックの場合とでクリーンアップをどのように行えるのか比較しましょう。
147
147
148
148
### クラスを使った例
149
149
@@ -266,7 +266,7 @@ function FriendStatus(props) {
266
266
267
267
### ヒント:関心を分離するために複数の副作用を使う
268
268
269
- フックを[導入する動機](/docs/hooks-intro.html#complex-components-become-hard-to-understand)のページで述べた問題のひとつは、しばしばライフサイクルメソッドには無関係なロジックが含まれ 、一方で関連するロジックが複数のメソッドに分割されてしまう、ということです。以下に示すのは、これまでの例で挙げたカウンタとフレンド状態インジケータとを組み合わせたコンポーネントです。
269
+ フックを[導入する動機](/docs/hooks-intro.html#complex-components-become-hard-to-understand)のページで述べた問題のひとつは、しばしばそれぞれのライフサイクルメソッドに関連のないロジックが含まれ 、一方で関連するロジックが複数のメソッドに分割されてしまう、ということです。以下に示すのは、これまでの例で挙げたカウンタとフレンド状態インジケータとを組み合わせたコンポーネントです。
270
270
271
271
` ` ` js
272
272
class FriendStatusWithCounter extends React .Component {
@@ -403,7 +403,7 @@ function FriendStatus(props) {
403
403
404
404
動作は変わっておらず、前述のバグも起こらなくなります。
405
405
406
- ` useEffect` は*デフォルトで*更新を処理するため、更新のための特別なコードは不要です。新しい副作用を適用する前に、ひとつ前の副作用をクリーンアップします。これを例示するため、このコンポーネントが発生させる可能性のある購読登録と購読解除のシーケンスをお示しします :
406
+ ` useEffect` は*デフォルトで*更新を処理するため、更新のための特別なコードは不要です。新しい副作用を適用する前に、ひとつ前の副作用をクリーンアップします。これを例示するため、このコンポーネントが経時的に発生させる可能性のある購読登録と購読解除のシーケンスを示しします :
407
407
408
408
` ` ` js
409
409
// Mount with { friend: { id: 100 } } props
You can’t perform that action at this time.
0 commit comments