Vue.js

Vue.js

Vueの基本的な実装方法4(ディレクティブのv-if, v-for, v-showについて)

はじめに 今回は、前回概要だけ紹介したディレクティブ(v-で始まるVue.js特有の属性)のv-if,v-for,v-showについて解説します。 v-ifの使用方法について v-ifは、指定された条件が真(true)の場合に要素をレンダリ...
Vue.js

Vue.jsの基本的な実装方法3(データバインディングの方法について)

はじめに 今回は、データバインディングの方法について解説します。 テキストデータバインディングの方法 ./components/HelloWorld.vueのコードを以下のように修正します。 <template> <!-- テキストデータバ...
Vue.js

Vue.jsの基本的な実装方法2(Vueコンポーネントの作成・使用方法について)

はじめに 今回は、Vueコンポーネントの作成・使用方法について解説します。 Vueコンポーネントとは Vueコンポーネントは独立したUI部品で、ボタン、ナビゲーションバー、フォームなどのウェブアプリケーションのさまざまなUI要素を表します。...
Vue.js

Vue.jsの基本的な実装方法1(基本的なフォルダ構成について)

はじめに Vue.jsの基本的な実装方法について解説します。今回は、基本的なフォルダ構成について解説します。 環境構築 今回は、「StackBlitz」と呼ばれるオンラインエディタを使用していきます。 以下のURLにアクセスしてください。 ...