Vue.js よく使うディレクティブとコンポーネント 簡単

Vue.js [3]の学習備忘録

Vue.jsをインストール

ディレクティブを学ぶ

• v- で始まる特別な属性のこと
• derective(司令)という名前の通り、Vue.jsに何らかの指示を行う仕組み

（ディレクティブ例）

• v-bind(属性のデータバインディング)
• v-if（条件分岐）
• v-for（オブジェクトの繰り返し描画）
• v-on（イベント処理）
• v-model（双方向データバインディング）

コンポーネント

• 名前付きの再利用可能なインスタンス
• ページを構成するUI部品
• テンプレートとそのロジックから構成
• よく使うコンポーネント化
  →再利用性が高くなる
  →コードの見通しが良くなる

＝＝＝＞ 開発効率UP！