##はじめに
この記事では、「v-modelディレクティブ」と「v-bindディレクティブ」の違いについて説明しています。

##v-modelディレクティブとは？
v-modelディレクティブは、フォーム要素の値とプロパティ間でデータバインディングを有効化するディレクティブです。つまり、フォーム要素が変更されるとその値がプロパティ要素に反映され、逆に、プロパティ要素が変更されるとその値がフォーム要素に反映されるようになります。

v-modelディレクティブは次のように使用します。
<input v-model="プロパティ名">

また、こうしたデータバインディングの機能を「双方向データバインディング」と呼びます。

##双方向データバインディング
双方向バインディングは、単方向のデータバインディングの組み合わせ（v-onディレクティブとv-bindディレクティブ）で成り立っています。このことを図を使ってわかりやすく説明したものが次のものです。

##まとめ
v-modelディレクティブでは双方向（フォーム要素⇄プロパティ）で、v-bindディレクティブでは単方向（プロパティ→フォーム要素）で同期することができるといった違いがあります。

###参考文献
関利晴（2020）『21Stepで体得 Vue.jsハンズオン』