Skip to content

Commit daddda9

Browse files
committed
1 parent d4cfa03 commit daddda9

File tree

1 file changed

+22
-0
lines changed

1 file changed

+22
-0
lines changed

src/guide/migration/global-api.md

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,7 @@ const app = createApp({})
7676
| Vue.directive | app.directive |
7777
| Vue.mixin | app.mixin |
7878
| Vue.use | app.use ([以下を参照](#a-note-for-plugin-authors)) |
79+
| Vue.prototype | app.config.globalProperties ([以下を参照](#vue-prototype-replaced-by-config-globalproperties)) | |
7980

8081
グローバルに振る舞いを変更しないその他のグローバル API は [グローバル API の Treeshaking](./global-api-treeshaking.html) にあるように、名前付きエクスポートになりました。
8182

@@ -106,6 +107,25 @@ Vue 3.0 では、要素がコンポーネントであるかどうかのチェッ
106107
- これは、Vue CLI 設定の新しいトップレベルのオプションになります。
107108
:::
108109

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+
109129
### プラグイン作者へのノート
110130

111131
プラグイン作者の一般的なプラクティスとして、`Vue.use` を使ってプラグインを自動的に UMD ビルドにインストールさせるものがありました。例えば、公式の `vue-router` プラグインのブラウザ環境へのインストールは以下のようになっていました:
@@ -178,6 +198,8 @@ export default {
178198
}
179199
```
180200

201+
`provide` を使うことは、特にプラグインを書くときに、 `globalProperties` の代わりになります。
202+
181203
## アプリケーション間での設定の共有
182204

183205
コンポーネントや、ディレクティブの設定をアプリケーション間で共有する方法の一つとして、以下のようなファクトリ関数があります:

0 commit comments

Comments
 (0)