Vue.jsのv-bindとv-model - Qiita

v-bind Vue.jsのディレクティブの一つ HTMLの属性にVue.jsのデータをバインドすることができ、JavaScriptの式を用いて動的にHTMLの属性を変更することが出来ます。 v-bindの省略形としてコロン(:)を使うことも可能です。 サンプルコード <template> <div> <h2 v-bind:title="titleText">Hello, World!</h2> </div> </template> <script> export default { data() { return { titleText: 'タイトルです！' } } } </script> v-bind:titleを使用して、<h2>要素のtitle属性をVue.jsのデータ titleText にバインド titleTextの値が変更されると、<h2>要素のtitle属性も自動的に変更