File tree Expand file tree Collapse file tree 2 files changed +5
-5
lines changed Expand file tree Collapse file tree 2 files changed +5
-5
lines changed Original file line number Diff line number Diff line change @@ -97,7 +97,7 @@ app.component('todo-list', {
97
97
98
98
## リアクティブと連携する
99
99
100
- 前述の例では、リスト ` todos ` を変更しても、その変更は注入された ` todoLength ` には反映されません。これは、` provide/inject ` の束縛( binding )がデフォルトでリアクティブ _ でない_ ことが原因です。` ref ` で定義されたプロパティや ` reactive ` で作成されたオブジェクトを ` provide ` に渡すことにより、この振る舞いを変更することができます。この場合、祖先コンポーネントをリアクティブにするためには、コンポジション API の ` computed ` で定義したプロパティを ` todoLength ` を割り当てる必要があります。
100
+ 前述の例では、リスト ` todos ` を変更しても、その変更は注入された ` todoLength ` には反映されません。これは、` provide/inject ` の束縛( binding )がデフォルトでリアクティブ _ でない_ ことが原因です。` ref ` で定義されたプロパティや ` reactive ` で作成されたオブジェクトを ` provide ` に渡すことにより、この振る舞いを変更することができます。この場合、祖先コンポーネントをリアクティブにするためには、Composition API の ` computed ` で定義したプロパティを ` todoLength ` を割り当てる必要があります。
101
101
102
102
``` js
103
103
app .component (' todo-list' , {
@@ -110,4 +110,4 @@ app.component('todo-list', {
110
110
})
111
111
```
112
112
113
- こうすると、` todos.length ` へのあらゆる変更が、` todoLength ` が注入されたコンポーネントに正しく反映されます。` reactive ` の provide/inject の詳細については、[ コンポジション API セクション] ( composition-api-provide-inject.html#injection-reactivity ) をご覧ください。
113
+ こうすると、` todos.length ` へのあらゆる変更が、` todoLength ` が注入されたコンポーネントに正しく反映されます。` reactive ` の provide/inject の詳細については、[ Composition API セクション] ( composition-api-provide-inject.html#injection-reactivity ) をご覧ください。
Original file line number Diff line number Diff line change 1
1
# Provide / Inject
2
2
3
- > このページは、すでに [ Provide / Inject] ( component-provide-inject.html ) 、[ コンポジション API 導入] ( composition-api-introduction.html ) 、[ リアクティブの基礎] ( reactivity-fundamentals.html ) を読み終えていることを想定しています。
3
+ > このページは、すでに [ Provide / Inject] ( component-provide-inject.html ) 、[ Composition API 導入] ( composition-api-introduction.html ) 、[ リアクティブの基礎] ( reactivity-fundamentals.html ) を読み終えていることを想定しています。
4
4
5
- [ provide / inject] ( component-provide-inject.html ) は コンポジション API でも使うことができます。どちらも現在アクティブなインスタンスの [ ` setup() ` ] ( composition-api-setup.html ) 中にのみ呼び出すことが可能です。
5
+ [ provide / inject] ( component-provide-inject.html ) は Composition API でも使うことができます。どちらも現在アクティブなインスタンスの [ ` setup() ` ] ( composition-api-setup.html ) 中にのみ呼び出すことが可能です。
6
6
7
7
## シナリオの背景
8
8
9
- これから、コンポジション API を使用して、以下のコードを書き直そうとしているとしましょう。以下のコードでは、` MyMap ` コンポーネントが ` MyMaker ` コンポーネントにユーザの位置情報を提供しています。
9
+ これから、Composition API を使用して、以下のコードを書き直そうとしているとしましょう。以下のコードでは、` MyMap ` コンポーネントが ` MyMaker ` コンポーネントにユーザの位置情報を提供しています。
10
10
11
11
``` vue
12
12
<!-- src/components/MyMap.vue -->
You can’t perform that action at this time.
0 commit comments