Vue.js入門【コンポーネント】
こんにちは、ミナトです。 「Vue.jsでUI部品を再利用したい」 このような時は、Vue.jsではコンポーネントを利用することで、再利用可能なVueインスタンスを定義できます。 今回はVue.jsのコンポーネントの基…
こんにちは、ミナトです。 「Vue.jsでUI部品を再利用したい」 このような時は、Vue.jsではコンポーネントを利用することで、再利用可能なVueインスタンスを定義できます。 今回はVue.jsのコンポーネントの基…
こんにちは、ミナトです。 「Vue.jsでフォームの入力でデータバインディングを行いたい」 このような時は、Vue.jsではv-modelディレクティブを利用することで、入力値とデータを双方向にデータバインディングできま…
こんにちは、ミナトです。 「Vue.jsでイベント発火時に処理を行いたい」 このような時は、Vue.jsではv-onディレクティブを利用することで、イベントに対する処理を実行できます。 今回はVue.jsのイベントハンド…
こんにちは、ミナトです。 「Vue.jsで条件によって表示を切り替えるにはどうしたらいいの?」 今回はこのような疑問に答えるために、Vue.jsでの「条件付きレンダリング」について解説します。 結論をお伝えすると、条件に…
こんにちは、ミナトです。 「Vue.jsで動的に見た目を変更するためにどうやってクラスを適用したらいいの?」と思われているかたのために、今回はVue.jsでの「クラスとスタイルのバインディング」について紹介します。 クラ…
こんにちは、ミナトです。 今回は、Vue.jsの「監視プロパティ(ウォッチャ)」について紹介します。 「監視プロパティ(ウォッチャ)」は、特定のデータまたは算出プロパティの状態を監視して、変化があった時に特定の処理を自動…
こんにちはMinatoです。今回はVue.jsの「算出プロパティ」の使い方をご紹介したいと思います。 算出プロパティの概要 テンプレート内には、JavaScript式を書くことができます。しかし、簡単な操作しかでず、テン…
Mustache構文内でのJavaScript式の使い方 Vue.jsでは、{{}}(Mustache構文)を用いて変数を展開することができます。そして、Mustache構文の中にはJavaScriptの式を記述すること…
こんにちはMinatoです。 前回までは、Vue.jsの基本的な使い方についてご紹介しました。今回は、前回までの復習として、より実践的なTODOアプリの実装に取り組みたいと思います。 前回の記事をまだ見ていないという方は…
こんにちはMinatoです。 前回、Vue.jsの導入方法からデータを画面に表示するところまで、基本的な流れをご紹介しました。 今回は、条件分岐や繰り返しなど、Vue.jsに何らかの指示を行う仕組み「ディレクティブ」と、…