【Vue.js入門】使い方・サンプル集

Vue.jsの使い方を入門者向けにサンプルコード付きでまとめました。

Vue.jsとは

Vue.jsとは、JavaScriptのWebアプリ制作用フレームワークです。

Vue.jsの主な特徴
1 コードがシンプル(学習コストが低い)
2 導入が簡単(既にHTMLがある状態で組み込み可能、HTMLとJSが独立)
3 よく使われるライブラリ群は公式から提供されているしており安心。
4 PHPの人気フレームワーク「Laravel5.3~」にも標準搭載

Vue.jsの使い方

Vue.jsの使い方について下記に整理しました。

カテゴリ Vue.jsの基本操作
はじめに Hello Worldダウンロード(ローカルで利用)
レンダリング v-html(HTMLレンダリング)v-bind(HTML属性の操作)v-pre(テキストをそのまま表示)v-cloak({{ … }} の表示抑制)v-once(1度だけ表示)
制御構文 v-if(条件分岐)v-show(Hidden付与)v-for(繰り返し)
イベント処理 v-on(イベント処理)
フォーム 入力文字数の制限v-model(双方向データバインディング)
関連ページ
1 Vue.js公式リファレンス
2 Vue.js入門
関連記事