From 5b81525e447b61d03c3d9580ec78466518c945e2 Mon Sep 17 00:00:00 2001 From: Takuma Hanatani Date: Sun, 26 Feb 2017 22:51:03 +0900 Subject: [PATCH 1/6] =?UTF-8?q?Production=20tip=E5=91=A8=E3=82=8A=E3=82=92?= =?UTF-8?q?=E7=BF=BB=E8=A8=B3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/v2/api/index.md | 39 ++++++++++++++++++++++++++++++++++----- 1 file changed, 34 insertions(+), 5 deletions(-) diff --git a/src/v2/api/index.md b/src/v2/api/index.md index 75880c1e8..d6bfee7fa 100644 --- a/src/v2/api/index.md +++ b/src/v2/api/index.md @@ -65,17 +65,21 @@ type: api - **型:** `Function` -- **デフォルト:** エラーが代わりにスローされます +- **デフォルト:** `undefined` - **使用方法:** ``` js - Vue.config.errorHandler = function (err, vm) { + Vue.config.errorHandler = function (err, vm, type) { // エラー処理 + // `type` は Vue 固有のエラー種別です。(例: どのライフサイクルフックかなど) + // このエラーを見つけることができるのは、 2.2.0 以降となります。 } ``` - コンポーネントの描画とウォッチャいおいて未捕獲のエラーに対してハンドラを割り当てます。ハンドラはエラーと Vue インスタンスが引数に渡されて呼び出されます。 + コンポーネントの描画関数とウォッチャにおいて未捕獲のエラーに対してハンドラを割り当てます。ハンドラはエラーと Vue インスタンスが引数に渡されて呼び出されます。 + + > 2.2.0 では、このフックは、コンポーネントのライフサイクルフックに関するエラーも捉えます。また、このフックが `undefined` である場合、捕捉されたエラーは、アプリケーションをクラッシュさせずに、代わりに `console.error` として記録されます。 > このオプションのを使用して、[Sentry](https://sentry.io) というエラー追跡サービスを[公式に統合](https://sentry.io/for/vue/)ために使用します。 @@ -110,11 +114,36 @@ type: api f1: 112, mediaPlayPause: 179, up: [38, 87] - } + } ``` `v-on` 向けにカスタムキーエイリアスを定義します。 +## performance + +> 2.2.0 の新機能 + +- **型:** `boolean` + +- **デフォルト:** `false` + +- **使用方法**: + + これを `true` に設定することで、コンポーネントの初期化やコンパイル、レンダリングや、パッチのパフォーマンスなどを、ブラウザ上の開発者ツールにてトレースすることが可能となります。 この機能は、開発者モードおよび [performance.mark](https://developer.mozilla.org/en-US/docs/Web/API/Performance/mark) APIをサポートするブラウザでのみ動作します。 + +### productionTip + +> 2.2.0 の新機能 + +- **型:** `boolean` + +- **デフォルト:** `true` + +- **使用方法**: + + これを `false` に設定すると、 Vue の起動時のプロダクションのヒントが表示されなくなります。 + Set this to `false` to prevent the production tip on Vue startup. + ## グローバル API

Vue.extend( options )

@@ -340,7 +369,7 @@ type: api ```js var version = Number(Vue.version.split('.')[0]) - + if (version === 2) { // Vue v2.x.x } else if (version === 1) { From 7feff5f00277aa5bec17cff7b4dc3aa1c6e9f451 Mon Sep 17 00:00:00 2001 From: Takuma Hanatani Date: Sun, 26 Feb 2017 22:53:07 +0900 Subject: [PATCH 2/6] =?UTF-8?q?Vue.delete=E3=82=92=E7=BF=BB=E8=A8=B3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/v2/api/index.md | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/src/v2/api/index.md b/src/v2/api/index.md index d6bfee7fa..c3745d9f6 100644 --- a/src/v2/api/index.md +++ b/src/v2/api/index.md @@ -142,7 +142,6 @@ type: api - **使用方法**: これを `false` に設定すると、 Vue の起動時のプロダクションのヒントが表示されなくなります。 - Set this to `false` to prevent the production tip on Vue startup. ## グローバル API @@ -226,17 +225,19 @@ type: api - **参照:** [リアクティブの探求](../guide/reactivity.html) -

Vue.delete( object, key )

+

Vue.delete( target, key )

- **引数:** - - `{Object} object` - - `{string} key` + - `{Object | Array} target` + - `{string | number} key` - **使用方法:** オブジェクトのプロパティを削除します。オブジェクトがリアクティブの場合、削除がトリガし View が更新されることを保証します。これは主に Vue がプロパティの削除を検知できないという制約を回避するために使われますが、使う必要があることはまれです。 - **オブジェクトは Vue インスタンス、または Vue インスタンスのルートな data オブジェクトにできないことに注意してください。** + > 2.2.0 以降では、 Array とそのインデックスでも動作します。 + +

Vue インスタンスや Vue インスタンスのルートデータオブジェクトを対象とすることはできません。

- **参照:** [リアクティブの探求](../guide/reactivity.html) From 60d6a62061268347c707e8cba32fa9e3af6dc365 Mon Sep 17 00:00:00 2001 From: Takuma Hanatani Date: Sun, 26 Feb 2017 22:58:03 +0900 Subject: [PATCH 3/6] =?UTF-8?q?renderError=E3=81=AE=E7=BF=BB=E8=A8=B3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/v2/api/index.md | 30 +++++++++++++++++++++++++++++- 1 file changed, 29 insertions(+), 1 deletion(-) diff --git a/src/v2/api/index.md b/src/v2/api/index.md index c3745d9f6..9ce275c34 100644 --- a/src/v2/api/index.md +++ b/src/v2/api/index.md @@ -632,7 +632,7 @@ type: api ### render -- **型:** `Function` +- **型:** `(createElement: () => VNode) => VNode` - **詳細:** @@ -643,6 +643,34 @@ type: api - **参照:** - [描画関数](../guide/render-function.html) +### renderError + +> 2.2.0 からの進行 + +- **型:** `(createElement: () => VNode, error: Error) => VNode` + +- **詳細:** + + **development モードでのみ動作します。** + + デフォルトの `render` 関数にてエラーが発生した際に、代替となる描画結果を提供します。この際、エラー内容は `renderError` へ、第二引数として渡されます。この機能は、ホットリロードなどと併用する場合に重宝します。 + +- **例:** + + ``` js + new Vue({ + render (h) { + throw new Error('oops') + }, + renderError (h, err) { + return h('pre', { style: { color: 'red' }}, err.stack) + } + }).$mount('#app') + ``` + +- **参照:** + - [描画関数](../guide/render-function) + ## オプション / ライフサイクルフック 全てのライフサイクルフックは、データ、算出プロパティ、およびメソッドにアクセスできるようにするために、自動的にインスタンスに束縛する `this` コンテキストを持っています。これは、__ライフサイクルメソッド(例 `created: () => this.fetchTodos()`) を定義するためにアロー関数を使用すべきではないこと__を意味します。アロー関数は、`this` が期待する Vue インスタンスではなく、`this.fetchTodos` が undefined になるため、親コンテキストに束縛できないことが理由です。 From a752d1f4b0efe8250d4b3581bc063da85e48c41e Mon Sep 17 00:00:00 2001 From: Takuma Hanatani Date: Sun, 26 Feb 2017 23:36:18 +0900 Subject: [PATCH 4/6] =?UTF-8?q?index.md=E3=81=AE=E7=BF=BB=E8=A8=B3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/v2/api/index.md | 147 +++++++++++++++++++++++++++++++++++++++----- 1 file changed, 133 insertions(+), 14 deletions(-) diff --git a/src/v2/api/index.md b/src/v2/api/index.md index 9ce275c34..8ffd93eb1 100644 --- a/src/v2/api/index.md +++ b/src/v2/api/index.md @@ -835,7 +835,7 @@ type: api - **参照:** - [コンポーネント](../guide/components.html) -## オプション / その他 +## オプション / 組成 ### parent @@ -873,18 +873,6 @@ type: api - **参照:** [ミックスイン](../guide/mixins.html) -### name - -- **型:** `string` - -- **制約:** コンポーネントのオプションで使われたときのみ、有効なので注意してください。 - -- **詳細:** - - テンプレート内でのコンポーネント自身の再帰呼び出しを許可します。コンポーネントは `Vue.component()` でグローバルに登録され、グローバル ID はその名前に自動的に設定される事に注意してください。 - - `name` オプションのもう1つの利点は、デバッギングです。名前付きコンポーネントはより便利な警告メッセージが表示されます。また、[vue-devtools](https://github.com/vuejs/vue-devtools) でアプリケーションを検査するとき、名前付きでないコンポーネントは `` として表示され、とても有益ではありません。`name` オプションの提供によって、はるかに有益なコンポーネントツリーを取得できるでしょう。 - ### extends - **型:** `Object | Function` @@ -907,6 +895,80 @@ type: api } ``` +### provide / inject + +> 2.2.0 からの新機能 + +- **型:** + - **provide:** `Object | () => Object` + - **inject:** `Array | { [key: string]: string | Symbol }` + +- **詳細:** + +

`provide` および `inject` は、高度なプラグインやコンポーネントのライブラリのために提供されています。一般的なアプリケーションのコードで利用することは推奨されません。

+ + このペアとなるオプションは、コンポーネントの階層にかかわらず、祖先となるコンポーネントを、全ての子孫コンポーネントの依存オブジェクトとして動作させるために利用されます。 + React に精通している人は、 React のコンテキストの概念と非常によく似ていると捉えると良いでしょう。 + + `provide` オプションの値は、オブジェクトもしくはオブジェクトを返す関数である必要があります。 + プロバイダとなるオブジェクトには、その子孫に注入可能なプロパティが含まれています。また、このオブジェクトのキーとして、 ES2015 の Symbol を利用することが可能です。 + + `inject` オプションの値は、文字列の配列か、キー名がローカルのバインディング名を表すオブジェクト、もしくは注入可能なもので検索できるキー(文字列または Symbol )のいずれかである必要があります。 + + プロバイダとなるコンポーネントは、提供されたプロパティを注入するコンポーネントの親チェーン内である必要があります。 + +- **例:** + + ``` js + var Provider = { + provide: { + foo: 'bar' + }, + // ... + } + + var Child = { + inject: ['foo'], + created () { + console.log(this.foo) // -> "bar" + } + // ... + } + ``` + + ES2015のシンボルとともに `provide` 関数と `inject` オブジェクトを利用する場合: + + ``` js + const s = Symbol() + + const Provider = { + provide () { + return { + [s]: 'foo' + } + } + } + + const Child = { + inject: { s }, + // ... + } + ``` + +## オプション / その他 + +### name + +- **型:** `string` + +- **制約:** コンポーネントのオプションで使われたときのみ、有効なので注意してください。 + +- **詳細:** + + テンプレート内でのコンポーネント自身の再帰呼び出しを許可します。コンポーネントは `Vue.component()` でグローバルに登録され、グローバル ID はその名前に自動的に設定される事に注意してください。 + + `name` オプションのもう1つの利点は、デバッギングです。名前付きコンポーネントはより便利な警告メッセージが表示されます。また、[vue-devtools](https://github.com/vuejs/vue-devtools) でアプリケーションを検査するとき、名前付きでないコンポーネントは `` として表示され、とても有益ではありません。`name` オプションの提供によって、はるかに有益なコンポーネントツリーを取得できるでしょう。 + ### delimiters - **型:** `Array` @@ -937,6 +999,47 @@ type: api - **参照:** [関数型コンポーネント](../guide/render-function.html#関数型コンポーネント) +### model + +> 2.2.0 からの新機能 + +- **型:** `{ prop?: string, event?: string }` + +- **詳細:** + + カスタムコンポーネント内の `v-model` によって利用される prop 及びイベントのカスタマイズを許可します。デフォルトでは、コンポーネントにおける `v-model` は、 `value` を prop として、 `input` をイベントして用います。しかし、チェックボックスやラジオボタンなどの入力タイプを利用する場合は、 `value` prop をその他の目的で利用することができます。その際、 `model` オプションを利用することで、値の競合を避けることが可能です。 + +- **例:** + + ``` js + Vue.component('my-checkbox', { + model: { + prop: 'checked', + event: 'change' + }, + props: { + // これによって、 `value` prop を別の目的で利用することを許可します。 + value: String + }, + // ... + }) + ``` + + ``` html + + ``` + + 上の例の場合は、こうなります: + + ``` html + + + ``` + + ## インスタンスプロパティ ### vm.$data @@ -949,6 +1052,17 @@ type: api - **参照:** [オプション - データ](#data) +### vm.$props + +> 2.2.0 の新機能 + +- **型** `Object` + +- **詳細** + + コンポーネントが受け取った現在の props を表すオブジェクトです。 + Vue インスタンスプロキシは props オブジェクトのプロパティにアクセスします。 + ### vm.$el - **型:** `HTMLElement` @@ -1204,7 +1318,7 @@ type: api

vm.$on( event, callback )

- **引数:** - - `{string} event` + - `{string | Array} event` (Array は 2.2.0 以降でのみサポートされます) - `{Function} callback` - **使用方法:** @@ -1518,6 +1632,9 @@ type: api - `.{keyCode | keyAlias}` - 指定したキーが押された時のみトリガされるハンドラです。 - `.native` - コンポーネントのルート要素上のネイティブイベントに対して購読します。 - `.once` - 最大1回、ハンドラをトリガします。 + - `.left` - マウスの左ボタンが押された時のみトリガされるハンドラです。 + - `.right` - マウスの右ボタンが押された時のみトリガされるハンドラです。 + - `.middle` - マウスの中央ボタンが押された時のみトリガされるハンドラです。 - **使用方法:** @@ -1928,6 +2045,8 @@ type: api コンポーネントが `` 内部でトグルされるとき、`activated` と `deactivated` ライフサイクルフックはそれに応じて呼び出されます。 + > 2.2.0 以降では、``ツリーの中の全てのネストされたコンポーネントに対して、 `activated` および `deactived` が発火します。 + 主に、コンポーネント状態を保存したり、再描画を避けるために使用されます。 ```html From 55fde70de0c9fd0ea322bcfc9c2a833402e6be62 Mon Sep 17 00:00:00 2001 From: hkdnet Date: Mon, 27 Feb 2017 01:08:52 +0900 Subject: [PATCH 5/6] [WIP]Translate/v2.2/index (#1) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * 文の区切りがおかしいので修正 * 前置詞のニュアンスを変更 * timelineの訳抜け修正、performance tracingをenableする感じを出した * 誤字修正 * エラー内容 -> エラーに変更。particularlyの訳抜け修正 --- src/v2/api/index.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/v2/api/index.md b/src/v2/api/index.md index 8ffd93eb1..9cd7ac7cb 100644 --- a/src/v2/api/index.md +++ b/src/v2/api/index.md @@ -72,14 +72,14 @@ type: api ``` js Vue.config.errorHandler = function (err, vm, type) { // エラー処理 - // `type` は Vue 固有のエラー種別です。(例: どのライフサイクルフックかなど) - // このエラーを見つけることができるのは、 2.2.0 以降となります。 + // `type` は Vue 固有のエラー種別です(例: どのライフサイクルフックでエラーが起きたかなど)。 + // 2.2.0 以降で使用できます。 } ``` コンポーネントの描画関数とウォッチャにおいて未捕獲のエラーに対してハンドラを割り当てます。ハンドラはエラーと Vue インスタンスが引数に渡されて呼び出されます。 - > 2.2.0 では、このフックは、コンポーネントのライフサイクルフックに関するエラーも捉えます。また、このフックが `undefined` である場合、捕捉されたエラーは、アプリケーションをクラッシュさせずに、代わりに `console.error` として記録されます。 + > 2.2.0 では、このフックは、コンポーネントのライフサイクルフック中のエラーも捉えます。また、このフックが `undefined` である場合、捕捉されたエラーは、アプリケーションをクラッシュさせずに、代わりに `console.error` を用いて記録されます。 > このオプションのを使用して、[Sentry](https://sentry.io) というエラー追跡サービスを[公式に統合](https://sentry.io/for/vue/)ために使用します。 @@ -129,7 +129,7 @@ type: api - **使用方法**: - これを `true` に設定することで、コンポーネントの初期化やコンパイル、レンダリングや、パッチのパフォーマンスなどを、ブラウザ上の開発者ツールにてトレースすることが可能となります。 この機能は、開発者モードおよび [performance.mark](https://developer.mozilla.org/en-US/docs/Web/API/Performance/mark) APIをサポートするブラウザでのみ動作します。 + これを `true` に設定することで、ブラウザの開発者ツールのタイムライン機能で、コンポーネントの初期化やコンパイル、描画、パッチのパフォーマンス追跡することが可能になります。 この機能は、開発者モードおよび [performance.mark](https://developer.mozilla.org/en-US/docs/Web/API/Performance/mark) APIをサポートするブラウザでのみ動作します。 ### productionTip @@ -645,7 +645,7 @@ type: api ### renderError -> 2.2.0 からの進行 +> 2.2.0 からの新機能 - **型:** `(createElement: () => VNode, error: Error) => VNode` @@ -653,7 +653,7 @@ type: api **development モードでのみ動作します。** - デフォルトの `render` 関数にてエラーが発生した際に、代替となる描画結果を提供します。この際、エラー内容は `renderError` へ、第二引数として渡されます。この機能は、ホットリロードなどと併用する場合に重宝します。 + デフォルトの `render` 関数にてエラーが発生した際に、代替となる描画結果を提供します。この際、エラーは `renderError` へ、第二引数として渡されます。この機能は、特にホットリロードなどと併用する場合に重宝します。 - **例:** From 8d8eaafec070fa0ac3efccea35ebf159ba308cb2 Mon Sep 17 00:00:00 2001 From: hkdnet Date: Tue, 28 Feb 2017 20:23:17 +0900 Subject: [PATCH 6/6] Translate/v2.2/index (#2) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * primarilyの訳抜けを修正 * allow X to Vの関係がわかるようにした、serve as Xがわかるようにした * feature -> 特徴にした とらえるとよい、というのではなく似てると断言しているが意訳として許容した * プロバイダとなる、とは書いてなかったので消した。無駄な受動態を直した * 長過ぎるので文を切った。keyがローカル名、valueが実名であることを明示した * Allowされるものを明示した。「値の競合」は明示されてないので消した。 value propのならなら残してもいいかもしれない * (2.2.0)が抜けてたので訳した * lintの指摘修正 --- src/v2/api/index.md | 26 +++++++++++++------------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/src/v2/api/index.md b/src/v2/api/index.md index 9cd7ac7cb..8d3b2ab85 100644 --- a/src/v2/api/index.md +++ b/src/v2/api/index.md @@ -79,7 +79,7 @@ type: api コンポーネントの描画関数とウォッチャにおいて未捕獲のエラーに対してハンドラを割り当てます。ハンドラはエラーと Vue インスタンスが引数に渡されて呼び出されます。 - > 2.2.0 では、このフックは、コンポーネントのライフサイクルフック中のエラーも捉えます。また、このフックが `undefined` である場合、捕捉されたエラーは、アプリケーションをクラッシュさせずに、代わりに `console.error` を用いて記録されます。 + > 2.2.0 では、このフックは、コンポーネントのライフサイクルフック中のエラーも捉えます。また、このフックが `undefined` の場合、捕捉されたエラーは、アプリケーションをクラッシュさせずに、代わりに `console.error` を用いて記録されます。 > このオプションのを使用して、[Sentry](https://sentry.io) というエラー追跡サービスを[公式に統合](https://sentry.io/for/vue/)ために使用します。 @@ -129,7 +129,7 @@ type: api - **使用方法**: - これを `true` に設定することで、ブラウザの開発者ツールのタイムライン機能で、コンポーネントの初期化やコンパイル、描画、パッチのパフォーマンス追跡することが可能になります。 この機能は、開発者モードおよび [performance.mark](https://developer.mozilla.org/en-US/docs/Web/API/Performance/mark) APIをサポートするブラウザでのみ動作します。 + これを `true` に設定することで、ブラウザの開発者ツールのタイムライン機能で、コンポーネントの初期化やコンパイル、描画、パッチのパフォーマンス追跡することが可能になります。 この機能は、開発者モードおよび [performance.mark](https://developer.mozilla.org/en-US/docs/Web/API/Performance/mark) API をサポートするブラウザでのみ動作します。 ### productionTip @@ -905,17 +905,17 @@ type: api - **詳細:** -

`provide` および `inject` は、高度なプラグインやコンポーネントのライブラリのために提供されています。一般的なアプリケーションのコードで利用することは推奨されません。

+

`provide` および `inject` は、主に高度なプラグインやコンポーネントのライブラリのために提供されています。一般的なアプリケーションのコードで利用することは推奨されません。

- このペアとなるオプションは、コンポーネントの階層にかかわらず、祖先となるコンポーネントを、全ての子孫コンポーネントの依存オブジェクトとして動作させるために利用されます。 - React に精通している人は、 React のコンテキストの概念と非常によく似ていると捉えると良いでしょう。 + この1組のオプションは、コンポーネントの階層がどれほど深いかにかかわらず、祖先コンポーネントが、自身の子孫コンポーネント全てに対する依存オブジェクトの注入役を務めることができるようにするために利用されます。 + React に精通している人は、 React のコンテキストの特徴と非常によく似ていると捉えると良いでしょう。 - `provide` オプションの値は、オブジェクトもしくはオブジェクトを返す関数である必要があります。 - プロバイダとなるオブジェクトには、その子孫に注入可能なプロパティが含まれています。また、このオブジェクトのキーとして、 ES2015 の Symbol を利用することが可能です。 + `provide` オプションの値は、オブジェクトもしくはオブジェクトを返す関数でなくてはなりません。 + このオブジェクトは自身の子孫に注入可能なプロパティを含みます。また、このオブジェクトのキーとして、 ES2015 の Symbol を利用することが可能です。 - `inject` オプションの値は、文字列の配列か、キー名がローカルのバインディング名を表すオブジェクト、もしくは注入可能なもので検索できるキー(文字列または Symbol )のいずれかである必要があります。 + `inject` オプションの値は、文字列の配列か、オブジェクトのいずれかでなくてはなりません。オブジェクトの場合、キーがローカルのバインディング名を表し、バリューが利用可能な注入オブジェクトを探すときのキー(文字列または Symbol)となります。 - プロバイダとなるコンポーネントは、提供されたプロパティを注入するコンポーネントの親チェーン内である必要があります。 + プロバイダとなるコンポーネントは、提供されたプロパティを注入するコンポーネントの親チェーン内にある必要があります。 - **例:** @@ -1007,7 +1007,7 @@ type: api - **詳細:** - カスタムコンポーネント内の `v-model` によって利用される prop 及びイベントのカスタマイズを許可します。デフォルトでは、コンポーネントにおける `v-model` は、 `value` を prop として、 `input` をイベントして用います。しかし、チェックボックスやラジオボタンなどの入力タイプを利用する場合は、 `value` prop をその他の目的で利用することができます。その際、 `model` オプションを利用することで、値の競合を避けることが可能です。 + `v-model` が指定されたとき、カスタムコンポーネントが prop 及びイベントをカスタマイズすることを許可します。デフォルトでは、コンポーネントにおける `v-model` は、 `value` を prop として、 `input` をイベントして用います。しかし、チェックボックスやラジオボタンなどの入力タイプは、 `value` prop を他の目的で利用したいことがあるかもしれません。その際、 `model` オプションを利用することで、競合を避けることが可能です。 - **例:** @@ -1632,9 +1632,9 @@ type: api - `.{keyCode | keyAlias}` - 指定したキーが押された時のみトリガされるハンドラです。 - `.native` - コンポーネントのルート要素上のネイティブイベントに対して購読します。 - `.once` - 最大1回、ハンドラをトリガします。 - - `.left` - マウスの左ボタンが押された時のみトリガされるハンドラです。 - - `.right` - マウスの右ボタンが押された時のみトリガされるハンドラです。 - - `.middle` - マウスの中央ボタンが押された時のみトリガされるハンドラです。 + - `.left` -(2.2.0以降)マウスの左ボタンが押された時のみトリガされるハンドラです。 + - `.right` -(2.2.0以降)マウスの右ボタンが押された時のみトリガされるハンドラです。 + - `.middle` -(2.2.0以降)マウスの中央ボタンが押された時のみトリガされるハンドラです。 - **使用方法:**