SOFTELメモ

</> 技術者募集

【Vue.js】 v-if と v-show の違い

問題

v-if と v-show って、見た目に表示/非表示される以外にどこが違うの??

vue.js

答え

● v-show は、要素の表示/非表示する。

display:block/none してもらう感じ。

● v-if は、要素の有無が変わる。

append したり、remove してもらう感じ。

(else ができる点も違うけど)

なので、CSSでfirst-childに適用したいと思ったとき、隠してくれるからと言って v-show を使っていると、非表示になったfirst-childに適用されたりする。

要素としてはそこにいて、表示/非表示したかったら v-show。

要素としてもようがないときはそこにいてほしくないときは v-if。

関連するメモ

コメント