Vue හි data මඟින් CSS පන්ති
data වස්තුවේ ගුණාංගවල අගයන් මත පදනම්ව අංගයකට CSS පන්ති එකතු කළ හැකිය.
උදාහරණයක් දෙස බලමු. අපට පහත ගුණාංග ඇතැයි සිතමු:
data() {
return {
isActive: true,
hasError: true,
}
}
අපගේ ගුණාංගවල අගයන් මත පදනම්ව අංගයට CSS පන්ති එකතු කරමු:
<template>
<p :class="{active: isActive, error: hasError}">
පෙළ
</p>
</template>
පහත ගුණාංග ලබා දී ඇත:
data() {
return {
isValid: true,
isDisabled: true,
}
}
මෙම ගුණාංගවල අගයන් මත පදනම්ව අනුරූප CSS පන්ති ටැගයට එකතු වන පරිදි සකසන්න.
