要素に対してカスタムの振る舞いや操作を追加するために使用される。テンプレート内でデータを表示したり操作したりするために、ディレクティブを使用する。ディレクティブはイベントリスナーを設定する。ユーザ自身が独自のディレクティブを定義することで、再利用性を高めることができる。名前は”v-”で始まる。以下のようにカスタムディレクティブを定義できることがわかる。下記のように書くこともできる。v-blue-background>青い背景</div></template>このコードでは、ある要素の背景色を青にしている。使用すれば良いし、カスタムディレクティブをわざわざ作成する必要もない。どんな時に使用するのがいいのだろうか。使用シーンについて考えてみたドキュメントを読んでみると次のような記載がある。操作することでしか機能を実現できない場合にのみ使用するのか。可能な限り組み込みのディレクティブを使用しろと。ここで再度ドキュメントを読み返すとこんなことが書いてあった。よって動的に作られた要素にも対応できることであるのだろう。実際に検証してみた下記のコードにて実際に検証してみた。設定した要素を切り替えて表示させてみる。