ელემენტების ჩართვა/გამორთვა Vue-ში

ახლა მოდით გავაკეთოთ ღილაკი, რომელიც აკონტროლებს აბზაცის ჩართვას/გამორთვას, ანუ პირველ დაწკაპუნებაზე გამოაჩენს მას, ხოლო მეორე დაწკაპუნებაზე - დამალავს. ამისთვის ღილაკზე დაწკაპუნებისას გამოვიძახებთ მეთოდს toggle:

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

მეთოდის კოდში საჭირო იქნება ავიღოთ თვისების visible მნიშვნელობა და გადავაბრუნოთ იგი მის საპირისპიროდ:

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

მოცემულია სამი აბზაცი და სამი ღილაკი. გახადეთ ისე, რომ თითოეული ღილაკი აკონტროლებდეს საკუთარი აბზაცის ჩართვას/გამორთვას.