File tree Expand file tree Collapse file tree 1 file changed +22
-0
lines changed Expand file tree Collapse file tree 1 file changed +22
-0
lines changed Original file line number Diff line number Diff line change @@ -76,6 +76,7 @@ const app = createApp({})
76
76
| Vue.directive | app.directive |
77
77
| Vue.mixin | app.mixin |
78
78
| Vue.use | app.use ([ 以下を参照] ( #a-note-for-plugin-authors ) ) |
79
+ | Vue.prototype | app.config.globalProperties ([ 以下を参照] ( #vue-prototype-replaced-by-config-globalproperties ) ) | |
79
80
80
81
グローバルに振る舞いを変更しないその他のグローバル API は [ グローバル API の Treeshaking] ( ./global-api-treeshaking.html ) にあるように、名前付きエクスポートになりました。
81
82
@@ -106,6 +107,25 @@ Vue 3.0 では、要素がコンポーネントであるかどうかのチェッ
106
107
- これは、Vue CLI 設定の新しいトップレベルのオプションになります。
107
108
:::
108
109
110
+ ### ` Vue.prototype ` は ` config.globalProperties ` と置換
111
+
112
+ Vue 2 では、すべてのコンポーネントでアクセス可能なプロパティを追加するために、 ` Vue.prototype ` がよく使われていました。
113
+
114
+ Vue 3 では、 [ ` config.globalProperties ` ] ( /api/application-config.html#globalproperties ) が同様のものです。これらのプロパティは、アプリケーション内でコンポーネントをインスタンス化する際にコピーされます:
115
+
116
+ ``` js
117
+ // before - Vue 2
118
+ Vue .prototype .$http = () => {}
119
+ ```
120
+
121
+ ``` js
122
+ // after - Vue 3
123
+ const app = Vue .createApp ({})
124
+ app .config .globalProperties .$http = () => {}
125
+ ```
126
+
127
+ また ` globalProperties ` の代わりに ` provide ` ([ 後述] ( #provide-inject ) ) を使うことも考えられます。
128
+
109
129
### プラグイン作者へのノート
110
130
111
131
プラグイン作者の一般的なプラクティスとして、` Vue.use ` を使ってプラグインを自動的に UMD ビルドにインストールさせるものがありました。例えば、公式の ` vue-router ` プラグインのブラウザ環境へのインストールは以下のようになっていました:
@@ -178,6 +198,8 @@ export default {
178
198
}
179
199
```
180
200
201
+ ` provide ` を使うことは、特にプラグインを書くときに、 ` globalProperties ` の代わりになります。
202
+
181
203
## アプリケーション間での設定の共有
182
204
183
205
コンポーネントや、ディレクティブの設定をアプリケーション間で共有する方法の一つとして、以下のようなファクトリ関数があります:
You can’t perform that action at this time.
0 commit comments