การสลับการแสดงผลขององค์ประกอบใน Vue
ตอนนี้มาสร้างปุ่มที่จะสลับการแสดงผลของย่อหน้า
กล่าวคือคลิกครั้งแรกเพื่อแสดง
และคลิกครั้งที่สองเพื่อซ่อน
ในการทำเช่นนี้ เมื่อคลิกที่ปุ่ม
เราจะเรียกใช้เมธอด
toggle:
<template>
<button @click="toggle">สลับ</button>
<p v-if="visible">ข้อความ</p>
</template>
ในโค้ดของเมธอด จะต้องนำค่า
ของพรอพเพอร์ตี้ visible
มาและกลับค่าเป็นค่าตรงกันข้าม:
toggle: function() {
this.visible = !this.visible;
}
มีสามย่อหน้าและสามปุ่ม ทำให้แต่ละปุ่ม สามารถสลับการแสดงผลของย่อหน้าของตัวเองได้
