Lesson 13 — v-if

v-if versus v-show

Both hide things, in different ways. v-if removes the element from the page completely when false (and rebuilds it when true). v-show keeps it on the page and just hides it with CSS (display: none). Use v-show for things toggled very often, v-if for things that rarely appear.

<div v-if="isAdmin">Admin tools</div>   <!-- not in the page for others -->
<div v-show="menuOpen">Menu</div>        <!-- hidden, but still there -->

Why it matters: choosing the right one affects speed and what exists in the page.