@@ -56,7 +56,7 @@ export default {
56
56
57
57
** 論理的な関心事** が色でグループ化されている大きなコンポーネントを示す例。
58
58
59
- このような分離は、複雑なコンポーネントを理解ししてメンテナンスすることを難しくします 。このオプションの分離は背景にある論理的な関心事をわかりづらくします。さらに、単一の論理的な関心事に取り組む場合、関連するコードのオプションブロックを何度も "ジャンプ" する必要があります。
59
+ このような分離は、複雑なコンポーネントを理解してメンテナンスすることを難しくします 。このオプションの分離は背景にある論理的な関心事をわかりづらくします。さらに、単一の論理的な関心事に取り組む場合、関連するコードのオプションブロックを何度も "ジャンプ" する必要があります。
60
60
61
61
同じ論理的な関心事に関連するコードを並べることができれば、より良くなるでしょう。そして、これはまさにコンポジション API が可能にします。
62
62
@@ -87,9 +87,9 @@ export default {
87
87
setup (props ) {
88
88
console .log (props) // { user: '' }
89
89
90
- return {} // ここで返されるものは残りの要素で使用可能です
90
+ return {} // ここで返されるものはコンポーネントの他のオプションで使用可能です
91
91
}
92
- // 残りの要素
92
+ // 以降、コンポーネントの"他"のオプション
93
93
}
94
94
```
95
95
@@ -233,7 +233,7 @@ export default {
233
233
234
234
それらの関数はコンポーネントによってフックが呼び出されるときに実行されるコールバックを受け付けます。
235
235
236
- それを ` setup ` 関数に追加しましょう :
236
+ では、 ` setup ` 関数にそれを追加してみましょう :
237
237
238
238
``` js
239
239
// src/components/UserRepositories.vue `setup` function
@@ -260,13 +260,13 @@ setup (props) {
260
260
261
261
### ` watch ` で変化に反応する
262
262
263
- コンポーネント内の ` user ` プロパティに ` watch ` オプションを使用してウォッチャを追加するのと同じように、Vue からインポートした ` watch ` 関数を使用することができます。それは 3 つの引数を受け付けます:
263
+ コンポーネント内の ` user ` プロパティに ` watch ` オプションを使用してウォッチャを追加するのと同じように、Vue からインポートした ` watch ` 関数を使用することができます。それは以下の 3 つの引数を受け付けます:
264
264
265
265
- ** リアクティブな参照** または監視するゲッター関数
266
266
- コールバック
267
267
- 任意の設定オプション
268
268
269
- ** その仕組をざっと見てみましょう 。**
269
+ ** その仕組みをざっと見てみましょう 。**
270
270
271
271
``` js
272
272
import { ref , watch } from ' vue'
@@ -388,7 +388,7 @@ setup (props) {
388
388
}
389
389
```
390
390
391
- 他の** 論理的な関心事** にも同じことができますが、既に疑問があるかもしれません。- _ これはコードを ` setup ` オプションに移動させて肥大させるだけではありませんか?_ そのため他の責務に移る前に、まず上記のコードをスタンドアローンな ** コンポジション関数** に抽出します。 ` useUserRepositories ` の作成から始めましょう:
391
+ 他の** 論理的な関心事** にも同じことができますが、既に疑問があるかもしれません。- _ これはコードを ` setup ` オプションに移動させて肥大させるだけではありませんか?_ そのため他の責務に移る前に、まず上記のコードをスタンドアロンな ** コンポジション関数** に抽出します。 ` useUserRepositories ` の作成から始めましょう:
392
392
393
393
``` js
394
394
// src/composables/useUserRepositories.js
0 commit comments