Villkorliga grupper i Vue

Ibland behöver vi applicera ett villkor på en hel grupp av taggar samtidigt. I detta fall kan vi samla dem under en gemensam förälder och applicera villkoret på den:

html<template>
  <div v-if="isAuth">
    <p>+++</p>
    <p>+++</p>
    <p>+++</p>
  </div>
</template>

Ibland vill vi inte samla taggarna under en gemensam förälder. I det fallet kan de samlas av en template-tagg. Denna tagg grupperar andra taggar, men visas inte i den slutliga HTML-strukturen. Låt oss applicera ett villkor på denna tagg:

html<template>
  <template v-if="isAuth">
    <p>+++</p>
    <p>+++</p>
    <p>+++</p>
  </template>
</template>
Задание 1

Antag att du har tre stycken och en knapp. Gör så att när man klickar på knappen döljs dessa stycken.