กลุ่มเงื่อนไขใน Vue
บางครั้งเราต้องการกำหนดเงื่อนไข ให้กับกลุ่มแท็กหลายอันพร้อมกัน ใน กรณีนี้ เราสามารถรวมพวกมันด้วย ตัวแม่ทั่วมารวมกันและกำหนด เงื่อนไขให้กับตัวแม่นั้น:
<template>
<div v-if="isAuth">
<p>+++</p>
<p>+++</p>
<p>+++</p>
</div>
</template>
บางครั้งเราไม่ต้องการรวมแท็กด้วย
ตัวแม่ร่วม ในกรณีนี้
สามารถรวมพวกมันด้วยแท็ก template
แท็กนี้จะรวมแท็กอื่นๆเข้าด้วยกัน
แต่จะไม่ปรากฏในโครงสร้าง HTML สุดท้าย
มาลองกำหนดเงื่อนไขให้กับแท็กนี้:
<template>
<template v-if="isAuth">
<p>+++</p>
<p>+++</p>
<p>+++</p>
</template>
</template>
สมมติว่าคุณมีสามย่อหน้าและปุ่มหนึ่งปุ่ม ทำให้เมื่อกดปุ่ม ย่อหน้าเหล่านี้ซ่อนหายไป