LU05.A11 - v-if and functions

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

1. Explaining the The directive v-if in your own word.
2. Being able to apply v-if in combination wit a function

• Code-example: v-if pizza 1
• Code-example: v-if pizza 2

As we are now capable to use v-if with logical values (true/false), and furhtermore check actual values e.g. numbers, this assignment is about hoch to check stings (words). For this we are going touse the function text.includes()</b> within our v-if. - Execute the script. As you can see the content of the variable text is displayed on the screen. - Now delete the word Pizza from the variable text. Execute your script again. - Note your realisations as a html-comment. - Save your script acoordingly, whether in your W3School workspace or on you local computer in your code-editor Webstorm ===== Assignment 2 ===== In the if paragraph there is a image of a pizza displayed as well. - Add a section v-else with a according img-tag which shows a different image than a pizza. - Note your realisations as a html-comment. - Save your script acoordingly, whether in your W3School workspace or on you local computer in your code-editor Webstorm ===== Solution ===== Lösung ===== Vocabulary ===== ^ English ^ German ^ | afterwards | anschliessend| | accordingly | entsprechend —- Volkan Demir