参考サイト https://jp.vuejs.org/v2/guide/components.html コンポーネントの使用 登録 new Vue({ el: '#some-element', }) Vue.component('my-component',{ //オプション }) 一度登録すると、カスタム要素<my-component>を使えるようになる。親のinstanceのtemplate内で</my-component>…

参考サイト https://jp.vuejs.org/v2/guide/forms.html フォーム入力バインディング formのinput要素と、textarea要素で、two-way binding を作成するには、v-modelを使うことができる。（初期値は無視する。） テキストの例 <input v-model="message" placeholder="edit me"> <p>Message is : {{ message }}</p> 複…

参考サイト https://jp.vuejs.org/v2/guide/events.html イベントの購読（subscribe) v-on ディレクティブ <div id="example-1"> <button v-on:click="counter += 1">Add 1</button> <p>The button above has been clicked {{ counter }} times.</p> </div> var example1 = new Vue({ el: '#example-1', data: { counter: 0 } }) メソッド…

参考サイト https://jp.vuejs.org/v2/guide/class-and-style.html クラスとスタイルのバインディング <div v-bind:class="{ active: isActive }"></div> <div class="static" v-bind:class="{ active: isActive, 'text-danger': hasError }"> </div> da…

参考サイト https://jp.vuejs.org/v2/guide/instance.html コンストラクタ vm (ViewModel の略) を Vue インスタンスの変数名としてよく使うらしい。 すべてのVue vmは、Vueコンストラクタ関数(new Vue)で、root Vue instance を作成することから始まる。roo…