条件によるレンダリング

この演習で学習する内容

  • v-ifディレクティブによるレンダリング
  • v-showディレクティブによるレンダリング

演習内容

最初に作成したHello World!を表示するアプリケーションを改良して、以下のディレクティブで<input type="checkbox">タグを利用して、表示/非表示(トグル)を制御してみましょう。

  • v-if
  • v-show

これらディレクティブ、何が違うのか比較してみましょう。

参考: 公式ドキュメント

解答例