山傘のプログラミング勉強日記

プログラミングに関する日記とどうでもよい雑記からなるブログです。

Vue 学習 part. 1

Vue.js

最近、phpの勉強をしていましたがフロント側はVueで何か作ろうかなと思い、Vueの学習をします。まあ、素のJavascriptで事足りるとは思いますが、勉強のための勉強をしていきます。

GitHub - YamaKasa3/vue-guide

v3.ja.vuejs.org

はじめに

カウンター

カウントを表示します。Hello Worldみたいなものですね。

Vue.js で タイマーのコンポーネントをつくる - Qiita

See the Pen QWKOQrg by ヤマカサ (@yamakasa33) on CodePen.

要素の属性を束縛

v-bind 属性をつけてリアクティブな振る舞いを付加する。

ユーザーの入力の制御

ボタンによる状態の更新と双方向バインディング

See the Pen zYKPjLw by ヤマカサ (@yamakasa33) on CodePen.

条件分岐とループ

v-if と v-for を使って条件分岐とループを実現します。

コンポーネントによる構成

再利用性を高めるためにコンポーネントに分割する。