In Vue.js there are two ways to handle the conditional content.
- v-if
- v-show
Both directives render the content if a certain condition is met. With v-if content is removed or added to the DOM by meeting a certain condition. Whereas with v-show it is just shown or hidden with CSS.
v-if can also be combined with v-else and v-else-if, but only on direct sibling elements.
Let’s take a look at an example in codepen.
