Preklapljanje elementov v Vue

Zdaj naredimo gumb, ki bo preklapljal odstavek, to je ob prvem kliku ga prikazal, ob drugem kliku pa skril. Za to ob kliku na gumb pokličimo metodo toggle:

App.vue<template>
  <button @click="toggle">toggle</button>
  <p v-if="visible">text</p>
</template>

V kode metode moramo vzeti vrednost lastnosti visible in jo obrniti na nasprotno vrednost:

javascripttoggle: function() {
  this.visible = !this.visible;
}