คำสั่ง v-else ใน Vue

คำสั่ง v-if ยังสามารถทำงาน ร่วมกับ v-else ได้ มาดูกันว่า ในทางปฏิบัติจะเป็นอย่างไร ให้คุณสมบัติ isAuth เก็บค่าที่บ่งชี้ว่า ผู้ใช้ได้รับการยืนยันตัวตนหรือไม่:

data() {
	return {
		isAuth: true, // ที่นี่จะเป็น true หรือ false
	}
}

มาทำให้แสดงข้อความหนึ่ง หรืออีกข้อความหนึ่ง ขึ้นอยู่กับค่า isAuth:

<template>
	<p v-if="isAuth">+++</p>
	<p v-else>---</p>
</template>

ให้คุณสมบัติ isAdmin:

data() {
	return {
		isAdmin: true,
	}
}

ให้แสดงข้อความหนึ่ง หรืออีกข้อความหนึ่ง ขึ้นอยู่กับค่าของคุณสมบัตินี้