ディレクティブ（directive 指示）
頭にvのつくキーワード
v-show, v-if/v-else/v-else, f-forなど
https://v2.ja.vuejs.org/v2/api/#%E3%83%87%E3%82%A3%E3%83%AC%E3%82%AF%E3%83%86%E3%82%A3%E3%83%96
v-cloak
ディレクティブに関連付けられたインスタンスのコンパイルが終了するまでの間残存する。
CSSルールと組み合わせて、コンパイルされていないMustacheバインディングを隠すのに使う。
（v-textとかのバインディングは影響されない）
v-onとevent.prevent
v-onの修飾子としてevent.preventDefaultや伝播の停止（bubllingStop）などが用意されている。
https://v2.ja.vuejs.org/v2/api/#v-on
computed
| オプション名 | methods | computed | watch |
|---|---|---|---|
| メソッド | 算出プロパティ | 監視プロパティ | |
| 使い方 | 一般的な関数と同様 | return内に特定したいdataを含めるthis.xxx | 特定したいdata名で作成 コールバック関数含める |
| キャッシュ | キャッシュされない | キャッシュする | キャッシュする |
| 実行タイミング | 再描画の度に実行 | 特定data変更時 特定dataを元に派生したデータを使うとき |
特定data変更時 特定のコールパック関数を実行 非同期・Ajaxなど |
thisとアロー関数
computedやmethodsなどで関数を作る場合、アロー関数でも記述できるがその場合thisの解釈が異なるため、引数二Vueインスタンスを明示的に渡す必要がある。
リアクティブシステム
すべてのコンポーネントインスタンスは対応するウォッチャインスタンスを持っていて、これはコンポーネントを描画する間に触れた（touched）プロパティをすべて依存性として記録している。その後、依存性のsetterがトリガされると、ウォッチャに通知してコンポーネントの再描が起動する。
リアクティブなプロパティは動的に追加することはできないため、予め空の変数として用意する必要がある。もしくはVueオブジェクトのスタティックメソッドset（）を使用して追加する。
https://v2.ja.vuejs.org/v2/guide/reactivity
ライフサイクル
https://v2.ja.vuejs.org/v2/guide/instance
https://v2.ja.vuejs.org/v2/api/#%E3%82%AA%E3%83%97%E3%82%B7%E3%83%A7%E3%83%B3-%E3%83%A9%E3%82%A4%E3%83%95%E3%82%B5%E3%82%A4%E3%82%AF%E3%83%AB%E3%83%95%E3%83%83%E3%82%AF
created とmountedの違い
created ・・・ data生成のタイミング（非同期通信でデータ取得したい場合）
mounted ・・・ DOM生成のタイミング（まずはmounted後で）
computedはmountedより前に生成される。
mountedはすべての子コンポーネントがマウントされていることを保証しないことに注意してください。ビュー全体がレンダリングされるまで待つ場合は、mountedのかわりにvm.$nextTickを使うことができます。
nextTickはDOMContentLoadedのタイミングに近しい
双方向バインディングにするには
- v-model
- computedでgetterとsetterを用意したメンバをバインディングする
コメントを残す