Vue :class மற்றும் :style-க்கு பொருள் மற்றும் வரிசை சிறப்புக் கணினிஐ வழங்குகிறது, இதனால் நீங்கள் எதிர்வினைத்தக வצורை அடிப்படையாக கொண்டு வகுப்புகள் மற்றும் உட்பொதிய பாணிகளைக் கட்டுப்படுத்தி பயன்படுத்தலாம் — வகுப்பு சரங்களை கைமுறையாக உருவாக்குவதை விட சுத்தம்।
:class-க்கான பொருள் வாக்யம் — நிலையின் அடிப்படையில் வகுப்புகளை மாற்றுக
vue
<script setup>
import { ref } from "vue";
const isActive = ref(true);
const hasError = ref(false);
</script>
<template>
<!-- a class is applied when its value is truthy -->
<div :class="{ active: isActive, 'text-red': hasError }">...</div>
<!-- renders class="active" (active=true, text-red=false) -->
</template>