はじめに
こんにちは！
今回は【Vue.js】v-ifとv-showの違いについてアウトプットしていきます！
v-ifとv-showの違い
v-if
・要素をDOMから削除・追加することで表示/非表示を切り替える。
⏩切り替えコストが高い。
・v-else、v-else-ifが使える。
v-show
・CSSのdisplayプロパティを使って表示/非表示を切り替える。
⏩初期描画コストが高い。
・v-else、v-else-ifが使えない。
まとめ
・v-ifは実行時に条件を変更することはほとんどない場合に使用するのが推奨されます。
・v-showは表示/非表示を頻繁に繰り返す場合に使用するのが推奨されます。
最後に
今回はv-ifとv-showの違いについてアウトプットしました。
今回の記事を読んで質問、間違い等あればコメント等頂けると幸いです。
今後ともQiitaにてアウトプットしていきます！
最後までご愛読ありがとうございました！