Vue Tip #1 – v-if vs v-show #shorts

Subscribe to @NetNinja
Visit for more tips & tricks!


A lot of devs learning vue.js sometimes Get confused with the difference between Two of the view directives Viv and V Show and for all intents and purposes They do a very similar thing they Conditionally show content in the Browser dependent on a certain condition Being met right so if these conditions Evaluate to true then they show if they Evaluate to false then they don't so What's the difference between the two of Them well with the if when the condition Is false this block of code is Completely removed from the Dom and all Event listeners associated with it are Destroyed as well whereas with these Show the content is always rendered to The Dom but when the condition is false The element is hidden via CSS using Display not for that reason v-shell is Less costly if you're toggle in the Condition quite frequently but the Initial cost of v-show is slightly Higher than V if because the content is Always rendered at runtime and only then Hidden using CSS

You May Also Like

Leave a Reply

Your email address will not be published. Required fields are marked *