Vue-এ এলিমেন্ট টগল করা

এখন আসুন একটি বাটন তৈরি করি যা একটি অনুচ্ছেদ টগল করবে, অর্থাৎ প্রথম ক্লিকে এটি দেখাবে এবং দ্বিতীয় ক্লিকে লুকিয়ে দিবে। এটি করার জন্য বাটনে ক্লিক করে আমরা toggle মেথডটি কল করব:

App.vue<template>
  <button @click="toggle">টগল</button>
  <p v-if="visible">টেক্সট</p>
</template>

মেথডের কোডে visible প্রপার্টির মান নিয়ে এটিকে এর বিপরীতে ইনভার্ট করতে হবে:

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