Vue.jsに触れてみる
Vue.jsの基礎
Vueを使うことで、htmlの要素を操作することができます。
こちらのチュートリアルを進めていきます。
値を表示する
See the Pen eYYZbOV by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.
また、値を更新することも可能です
See the Pen JjjXeQe by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.
条件分岐
seen:true/falseで文字の表示/非表示を切り替えます
See the Pen QWWNzEg by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.
ループ処理…v-for
配列の値をリストに羅列することができます。
HTMLでは、配列'animals'の中身を取り出す際に、'animal'と命名し、その中の'name'もしくは'favorite'の値を表示しています
また、配列の項目を追加する場合は「push」を使用します。
See the Pen MWWyZoG by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.
