Vue.jsのv-modelを正しく使う - Qiitaはじめに v-modelはVue.jsを使ってフォームを構築する際によく使う機能です。 しかし、意外ときちんと使えていない場面を見かけることが多いので仕様と間違えやすいところを簡単に整理します。 v-modelの動作 公式のリファレンスにある通り、v-modelはv-onとv-bindをまとめて一行で書くためのシュガーシンタックスです つまり以下の二行は同じ動作をします <input v-model="searchText"> <input :value="searchText" @input="searchText = $event.target.value"> ※上記はテキストボックス <input type="text"> での例です。 公式リファレンスにあるように、チェックボックス、ラジオボタン、セレクトボックスの場合はプロパティが異なります。 表にまとめると、次のようになります。
