LU05.A07 - v-if (simple)

• Work type: Individual
• Means of aid: only teaching materials, no websearch, no use of ai.
• Timeframe: 5 Minutes
• Expected result: Vue script that displays HTML elements based on input values.

1. Explaining the The directive v-if in your own word.
2. Manipulating simple DOM elements based on the directive v-if

• Code-example: v-if directive src

In the script area of the W3-School example (link above) you will find a variable typewritersInStock with the value true. In the html area of the same script there will be decided, what is supposed to happen in which case. In the true-case there are typewriters on stock, and in the else-case (v-else) they are not.

1. Change the value of the variable onStock to false and run the script.
2. Note your realisations as a html-comment!
3. Save your script acoordingly, whether in your W3School workspace or on you local computer in your code-editor Webstorm.

Lösung

Volkan Demir