<template>
<span
class="description"
:class="darkMode ? 'dark-theme' : 'light-theme'"
>
This is how you add dynamic classes in Vue.
</span>
</template><div :class="{ 'prop-name': boolVar }"></div><div class="" :class="[
$ua.isFromPc() !== true ? '':'fs-5 p-3', ' border bg-secondary text-white rounded_3 test'
]" :id="`answer${key}`" style="cursor: pointer" @click="ClickingTest($event)">{{ value }}
</div>vue class binding if else
<div :class="{ 'prop-name': boolVar }"></div>
:class="darkMode ? 'dark-theme' : 'light-theme'"
If darkMode is true, we apply dark-theme as our class name.
Otherwise we choose light-theme.<button class="nav-link" id="home-tab" data-bs-toggle="tab" :data-bs-target="'#'+item.code" type="button"
role="tab" :aria-controls="'#'+item.code" aria-selected="true" :class="[
key == 0 ? 'active' : '',
]">
<img :src="item.icon" style="width: 20px">
{{ item.name }}
</button>