Vue CLIでプロジェクトを作成する [Vue.js]
Vue.jsには、アプリケーションのプロジェクトのテンプレートを自動生成してくれるコマンドラインツールの「Vue CLI」が用意され...
コンポーネントに定義したFunction型のpropsにメソッドを渡して処理を行う [Vue.js]
Vue.jsの親子コンポーネント間の通信は、親から子へデータを渡す時にはpropsを使用し、子から親へ通知を行う時には$emitメソ...
v-onディレクティブに複数のイベントを一括指定する [Vue.js]
ここではv-onディレクティブで、複数のイベントをまとめて一括で指定する方法について紹介します。 v-onディレクティブ V...
複数の要素のブロックを描画する<template>（v-if, v-for） [Vue.js]
v-ifディレクティブやv-forディレクティブは、単一の要素に対して指定する必要があります。 例えば、v-ifディレクティブを使...
マスタッシュ構文（{{…}}）による画面のチラツキを防止するv-cloakディレクティブ [Vue.js]
ここでは、Vue.jsのv-cloakディレクティブについて紹介します。 v-cloakディレクティブ マスタッシュ（Mus...
データを1度だけバインドするv-onceディレクティブ [Vue.js]
ここでは、Vue.jsのv-onceディレクティブについて紹介します。 v-onceディレクティブ Vue.jsのv-onc...
文字列をHTMLとして埋め込み要素のinnerHTMLを更新するv-htmlディレクティブ [Vue.js]
ここでは、Vue.jsのv-htmlディレクティブについて紹介します。 v-htmlディレクティブ 前回の記事でv-text...
要素のtextContentを更新するv-textディレクティブ [Vue.js]
ここでは、Vue.jsのv-textディレクティブについて紹介します。 v-textディレクティブ Vue.jsでは、Vue...
ディレクティブ（v-bind, v-on）の動的引数 [Vue.js]
Vue.jsのv-bindディレクティブを使用すると、HTML要素の属性に値をバインドすることができます。 v-bin...
v-bindディレクティブで複数の属性をまとめて一括指定する [Vue.js]
Vue.jsのv-bindディレクティブを使用すると、HTML要素の属性に値をバインドすることができます。 v-bin...
ディレクティブの省略記法 「v-bind: ⇒ :」「v-on: ⇒ @」[Vue.js]
Vue.jsでは、HTMLテンプレートでディレクティブを使用して、データをバインドしたりDOMを操作したりします。 デ...
コンポーネント間の通信 子から親へイベントを通知する$emit [Vue.js]
前回の記事では子コンポーネントにはpropsを経由して、親側のアプリケーションやコンポーネント（以下親コンポーネントと記載）のデータ...
コンポーネント間の通信 親から子へデータを渡すprops [Vue.js]
Vue.jsのコンポーネントは、Vueインスタンスを生成してアプリケーションを作成する場合と同様に、コンポーネント用のデータ（dat...
コンポーネントの基本 [Vue.js]
ここでは、Vue.jsのコンポーネントについて紹介します。 コンポーネントとは コンポーネントとはページを構成するUI部品の...
style属性（CSSスタイル）を指定するv-bindディレクティブ [Vue.js]
Vue.jsではHTML要素の属性を指定する際にv-bindディレクティブを使用します。 v-bindディレクティブによるバインデ...