diff --git a/src/v2/api/index.md b/src/v2/api/index.md index bebd1409d..0d1eace86 100644 --- a/src/v2/api/index.md +++ b/src/v2/api/index.md @@ -1,7 +1,7 @@ --- title: API type: api -updated: 2019-01-29 +updated: 2019-02-18 --- ## グローバル設定 @@ -85,6 +85,8 @@ updated: 2019-01-29 > 2.4.0 以降では、このフックは Vue のカスタムイベントハンドラ内部で投げられたエラーもキャプチャします。 + > 2.6.0 以降では、このフックは `v-on` DOM リスナ内で投げられたエラーもキャプチャします。加えて、フックやハンドラが Promise チェーン (例えば、async 関数) を返す場合、その Promise チェーンからのエラーもハンドリングされます。 + > エラー追跡サービスの [Sentry](https://sentry.io/for/vue/) と [Bugsnag](https://docs.bugsnag.com/platforms/browsers/vue/) はこのオプションを使用して公式の統合を提供しています。 ### warnHandler @@ -404,6 +406,35 @@ updated: 2019-01-29 - **参照:** [描画関数](../guide/render-function.html) +### Vue.observable( object ) + +> 2.6.0 から新規 + +- **引数:** + - `{Object} object` + +- **使用方法:** + + オブジェクトをリアクティブにします。内部的には、Vue は `data` 関数から返されたオブジェクトに対してこれを使っています。 + + 戻り値のオブジェクトは、[描画関数](../guide/render-function.html) や [算出プロパティ](../guide/computed.html) の中で直接使え、値が変更されたときには適切な更新をトリガーします。単純なシナリオでは、コンポーネントをまたぐ最小の state ストアとして使用することもできます: + + ``` js + const state = Vue.observable({ count: 0 }) + + const Demo = { + render(h) { + return h('button', { + on: { click: () => { state.count++ }} + }, `count is: ${state.count}`) + } + } + ``` + +

Vue 2.x では、`Vue.observable` は渡されたオブジェクトを直接操作するため、[ここでデモされる](../guide/instance.html#データとメソッド) ように戻り値のオブジェクトと等しくなります。Vue 3.x では、代わりにリアクティブプロキシを返し、元のオブジェクトを直接変更してもリアクティブにならないようにします。そのため、将来の互換性を考えると、`Vue.observable` に渡したオブジェクトではなく、返されたオブジェクトを使うことを推奨します。

+ +- **参照:** [リアクティブの探求](../guide/reactivity.html) + ### Vue.version - **詳細:** インストールされている Vue のバージョンを文字列として提供します。これはコミュニティのプラグインやコンポーネントで特に役立ち、異なるバージョンで違う戦略を使うことができます。 @@ -1347,7 +1378,7 @@ updated: 2019-01-29 - **デフォルト:** - プログラム的に[スロットにより配信された](/guide/components.html#スロットによるコンテンツ配信)コンテンツにアクセスするために使用されます。各[名前付きスロット](/guide/components.html#名前付きスロット) は自身に対応するプロパティを持ちます (例: `slot="foo"` のコンテンツは `vm.$slots.foo` で見つかります)。`default` プロパティは名前付きスロットに含まれない任意のノードを含みます。 + プログラム的に[スロットにより配信された](/guide/components.html#スロットによるコンテンツ配信)コンテンツにアクセスするために使用されます。各[名前付きスロット](../guide/components-slots.html#名前付きスロット) は自身に対応するプロパティを持ちます (例: `slot="foo"` のコンテンツは `vm.$slots.foo` で見つかります)。`default` プロパティは名前付きスロットに含まれない任意のノードを含みます。 `vm.$slots` のアクセスは、[描画関数](/guide/render-function.html) によるコンポーネントを書くときに最も便利です。 @@ -1393,19 +1424,25 @@ updated: 2019-01-29 > 2.1.0 から新規 -- **型:** `{ [name: string]: props => VNode | Array }` +- **型:** `{ [name: string]: props => Array | undefined }` - **読み込みのみ** - **詳細:** - [スコープ付きスロット (scoped slot)](../guide/components.html#スコープ付きスロット)にプログラムでアクセスするために使用されます。`default` を含む各スロットに対して、オブジェクトには VNode を返す対応する関数が含まれています。 + [スコープ付きスロット](../guide/components-slots.html#スコープ付きスロット) にプログラムでアクセスするために使用されます。`default` を含む各スロットに対して、オブジェクトには VNode を返す対応する関数が含まれています。 `vm.$scopedSlots` にアクセスする際に、[描画関数](../guide/render-function.html) でコンポーネントを書くときに最も便利です。 -- **See also:** - - [`` コンポーネント](#slot-1) - - [スコープ付きスロット](../guide/components.html#スコープ付きスロット) + **注意:** 2.6.0 以降では、このプロパティに特筆すべき変更が 2 つあります: + + 1. スコープ付きスロット関数は、戻り値が不正でない限り (この場合は `undefined` を返す) VNode の配列を返すことが保証されるようになりました。 + + 2. すべての `$slots` は `$scopedSlots` にも関数として公開されるようになりました。描画関数を使う場合、今後はスコープ付きを使うかどうかに関係なく、常に `$scopedSlots` 経由でスロットにアクセスすることを推奨します。これは、将来スコープを追加するリファクタリングをシンプルにするだけでなく、すべてのスロットが関数になる Vue 3 への移行を簡単にします。 + +- **参照:** + - [`` コンポーネント](#slot) + - [スコープ付きスロット](../guide/components-slots.html#スコープ付きスロット) - [描画関数 - スロット](../guide/render-function.html#スロット) ### vm.$refs @@ -1950,7 +1987,7 @@ updated: 2019-01-29 ### v-for -- **要求事項:** `Array | Object | number | string` +- **要求事項:** `Array | Object | number | string | Iterable (2.6 以降)` - **使用方法:** @@ -1978,6 +2015,8 @@ updated: 2019-01-29 ``` + 2.6 以降では、`v-for` はネイティブの `Map` や `Set`を含む、[Iterable プロトコル](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol) を実装した値でも動作できるようになりました。ただし、Vue 2.x は今のところ `Map` 値や `Set` 値をリアクティブにはできず、変更を自動的に検知できない点は注意しておく必要があります。 +

`v-if` といっしょに使用されるとき、`v-for` は `v-if` より優先度が高くなります。詳細についてはリストレンダリングのガイドを参照してください。

`v-for` の詳細な使用方法は下記にリンクしたガイドセクション内で説明しています。 @@ -2023,12 +2062,18 @@ updated: 2019-01-29 + + + + + + @@ -2100,9 +2145,15 @@ updated: 2019-01-29 + + + + + + @@ -2167,6 +2218,59 @@ updated: 2019-01-29 - [フォーム入力バインディング](../guide/forms.html) - [コンポーネント - カスタムイベントを使用してフォーム入力コンポーネント](../guide/components.html#カスタムイベントを使用したフォーム入力コンポーネント) +### v-slot + +- **省略記法:** `#` + +- **要求事項:** 関数定義の引数部分で有効な JavaScript 式 ([サポートされている環境](../guide/components-slots.html#スロットプロパティの分割代入) では分割代入も使用可能)。省略可 - プロパティがスロットに渡される場合のみ必要。 + +- **引数:** スロット名 (省略可。デフォルト値 `default`) + +- **適用対象制限:** + - `